Highlights - Cascades beta 1
UI structure and layout
Layout in modern mobile UI frameworks is a science. In this release, you will see our take on it. While we only support the most basic layouts (Stack, Dock, Absolute) at the moment, we have an architecture that allows you to create easy to use, scalable UIs. The layouts support features like padding, margins, weights, and sizing policies to make sure your UIs are scalable.
Cascades supports implicit and explicit animations. Implicit animations make it easy for you to build a dynamic and stylish UI, without having to spend too much time fine-tuning animations. You can still fine-tune your animations using the explicit animation APIs.
A rich set of UI controls encapsulating built-in design and the smart look of BlackBerry. A mix of simple and generic controls together with powerful, high-level controls such as the ActionBar makes it easier than ever to implement a great application structure using tabs and drill-down navigation.
You can use the WebView component to show HTML 5 content inline with Cascades UI controls. Bring the web to users of your app, while still creating a UI and user experience that's uniquely yours.
Cascades Builder extend the QNX Momentics IDE and provides a streamlined, powerful development environment for creating and deploying Cascades applications. You can use the Cascades Builder project wizard and the built-in templates, or create a project based on any of the bundled samples. You can create the application UI declaratively in QML using the QML source editor. In addition to test driving the UI on a device, you can take advantage of the UI preview. The UI preview renders the QML file displayed in your editor.
Cascades Exporter plug-in for Adobe Photoshop
The Cascades Exporter cuts and rescales graphics automatically, which can save designers a lot of time. When exporting a UI design from Photoshop, the plug-in creates a bundle with images and the corresponding layout information. You can import this set of assets as QML and images into Cascades Builder.
Cascades UI framework
All functionality is available as Qt based APIs and declarative components in QML.
- Activity indicator - An activity indicator is typically used when the amount of time a process takes can't be determined. The activity indicator is available in three different sizes.
- Progress indicator - A progress indicator is typically used when the amount of time a process takes can be determined and the process is long enough to display the remaining time to the user.
- Drop-down menu - A drop-down menu allows users to select an option from a list of options. An option in a drop-down menu can have an optional image and up to two text strings.
- Date and time picker - A date and time picker allows users to select a date and time. You can set different increments for the range of minutes, and you can set minimum and maximum values for the range (values outside the range will be grayed out). If an invalid value is selected, the picker moves back to the nearest valid value.
- Radio group - This control is used to present a list of options where only one option in the list can be selected at a time. Each option in the radio group can have text, a description, and an image.
- Action bar - The action bar is located at the bottom of the screen and can contain actions, tabs, or both. The action bar supports an overflow menu, which is shown from the right, and can be populated with actions. It also supports a sidebar menu, which is shown from the left, and can be populated with tabs. You can define which items you want to display and which menu they should be placed in.
- CrossCut menu - This control is a context-sensitive menu that is displayed when users press and hold an item in your application. The menu contains actions that are relevant for the pressed item, and is shown from the right. You can choose between pinned mode (which just shows the icons for the actions) and fully extracted mode (which lists all actions that are relevant for the pressed item).
- Navigation pane - A navigation pane allows users to navigate between different pages, or screens, in your application. The navigation pane acts as a stack, and you can push screens on to the stack to display them or pop them off of the stack to hide them.
- Foreign window - You can create native QNX windows and render those in a Cascades context. This version support windows that are placed at an absolute position with respect to other Cascades UI components.
- Segmented control - A segmented control is used to filter between different aspects of the content in a view. This basic version supports labels, but not images.
- Button - This control represents a button that users can click. You can choose from three different appearances: a button with a string, a button with an image, and a combination where both an image and a string can be added to the button.
- Check box - You can use a check box to present options where the selection is not exclusive and multiple options may be selected simultaneously.
- Container - A container is typically used as a wrapper for creating a larger layout and also for creating custom controls. Containers support scrolling vertically and horizontally together with rubber band and bounce effects.
- Divider - A divider can be used when you want to divide or separate items visually within a list.
- Label - A label is a simple block of text that is non-selectable. You can change the font color, format, and font style of the label.
- ImageView - This component is used to display images. Images can be scaled using fill method, aspect fit, or aspect fill.
- Slider - A slider is used for setting values within a defined range, allowing users to change values by dragging the slider left and right.
- TextArea - A text area shows both single and multi-line text. The text area can be editable to allow users to type text.
- TextField - A text field is a single, editable line of text, with or without a border.
- Toggle button - A toggle button is used to represent options that have only two states: on or off.
- If you don't find what you're looking for in the set of core UI controls, you can create your own controls by combining (or compositing) existing controls. This gives you unprecedented flexibility when designing your UIs.
- You can use the text styling API to customize the look of text-based controls in your apps. Use this API to specify visual properties such as formatting, style, alignment, and size.
- The resource management system in Cascades allows for asynchronous loading of .png and .jpg files, as well as loading images from pixel buffers.
- Vertical List - Create an elegant, smooth-scrolling vertical list. Your list can include data from an XML file, a JSON data structure, a SQLite database, or other data sources.
- Horizontal list - Build a list that scrolls horizontally instead of vertically, giving you more flexibility to display your data.
- Standard list item - Use this predefined style for normal items in your list, or extend the style to create your own bold list item designs. You can use core UI controls in your design, or create entirely new components to represent your data.
- Header list item - Take advantage of this predefined style for header items in your list, or use it as a starting point and create a unique header style of your own. Use header items to group list items and make it easy for your users to find the data they need.
- In-memory, or array-based - Use traditional methods of data storage and access, like storing your data in an array in memory.
- JSON - Store your data in a JSON data structure for a lightweight representation that's easy to use.
- SQLite - Implement data models that use SQLite to take advantage of relational database capabilities.
- Implicit animations - Let Cascades do the animating for you! Change property values and watch as UI controls are animated automatically. You can also control whether you want implicit animations to occur or not for controls in your apps.
- Explicit animations - Control the parameters of your animations precisely by specifying starting and ending positions, duration, easing curve, and more.
- Fade transition - Change the opacity of controls to emphasize the areas you want in your UI designs.
- Rotate transition - Rotate controls to add the right spin to your apps.
- Scale transition - Alter the sizes of your controls dynamically for a perfect fit every time.
- Translate transition - Move the elements of your app around with responsive and attractive sliding animations.
- Mutable animations - Make changes to your animations on the fly in response to user input or other factors.
- Group animations - Use parallel animations to play multiple animations at the same time, or use sequential animations to play them one after another.
- You can handle touch events with precision, and keep track of which components in your UI should receive touch events. The Cascades model for touch event propagation gives you the power to control and customize your user interactions.
- Absolute layout - Determine the layout of your UI down to the pixel, giving you the power to position your controls with precision.
- Dock layout - Align UI controls in different locations on the screen for lots of flexibility. The controls will stay aligned even if the size or resolution of your UI changes.
- Stack layout - Place your controls side by side, either horizontally or vertically, and use properties like margins, padding, and space quotas for that perfect arrangement.
Cascades platform APIs
- Battery - Detect and respond to changes in battery power level.
- Display - Determine the display size, resolution, ID, name, and aspect ratio of the device.
- LED - Set the blink color, frequency, and duration of the LED.
- Network status - Query the status of network connections and receive notification when the status changes.
- Payment Service - Include the Payment Service library in your app to offer subscriptions, unlock features, or sell any digital good that you've registered on the vendor portal for BlackBerry World.
- Version API - Determine the version of the BlackBerry OS that's installed on the device.
Supported platforms - Cascades Builder is integrated into the BlackBerry 10 Native SDK and QNX Momentics IDE, and share the same requirements but with the following deviations:
- Graphics card supporting Open GL 2 or higher is required.
- Windows XP, Windows 7, Mac OS X 10.6 and Mac OS X 10.7 are supported.
- Cascades project creation wizard - Create a new Cascades application project, based on one of the project templates, using the project creation wizard.
- QML file wizard - Create a new QML file, either empty or based on a template, using the QML file creation wizard.
- Cascades application examples - Create a new Cascades project based on one of the bundled example applications.
- QML source editor - Create and edit the QML file using the QML source editor.
- Syntax validation - Live detection and underline of syntax errors in QML.
- Code formatter - Reformat your QML code and fix indentation and spacing problems.
- QML templates - Code templates (or code snippets) can be used by invoking the code assist. You can use Tab to switch between the template's different fields and specify values for them. You can also edit or add your own templates from the Preferences menu.
- QML hover help - Move the mouse cursor over a symbol you want to know more about, and a pop-up window appears, giving you a short description.
- Component palette - Drag & drop from a palette of components into the QML source editor.
- See a visual preview of the QML file that you're editing. The preview is instantly updated as the QML is edited.
- Choose between code only, preview only, or split view to see the code and preview at the same time.
- A parse error cue (red/green) in the UI preview indicates when there are problems with parsing the QML (for example, due to errors in the QML code).
- Choose different resolutions to preview for different device form factors or for landscape/portrait orientations.
- Zoom in or out on the UI preview.
- Outline view - The outline view shows the structure of the UI (as a tree representation).
- Properties view - Select a QML component in the source editor and explore and edit its common properties in the properties view, or generate signal handlers.
- QML editing perspective - Open and arrange all relevant editors and views by using the provided QML editing perspective.
- Links to online documentation - Access the Cascades documentation and other online resources available at the developer site from links in the Help menu.
Cascades Exporter plug-in for Adobe Photoshop
- Export each layer as an individual image.
- Bundle exported images together with size and layout information in a ZIP file with the .tmz extension.
- Use absolute coordinates or coordinates relative to other groups for layout information [NEW].
- Choose to export only selected layers, or choose to exclude layers when exporting.
- Exporting text layers - Choose to export text layers as text element or to rasterize the text and export it as bitmap.
- Nine-slice - Export nine-sliced images by using visual guidelines to specify the nine-slice coordinates. This can help you preserve detail while using and scaling the image in your Cascades application.
- Rescaling images - Get significantly better results compared to using Photoshop's built-in rescaling feature. The crispness of the graphics is preserved by aligning the vector paths to the pixel grid.
- Import to Cascades Builder - Drag and drop the .tmz asset bundle into the Cascades Builder, and it is imported as images and QML code with the correct layout information.
Cascades UI framework
- Several limitations and issues exist when entering and displaying text in a TextArea or TextField. Hinting text is not properly displayed and TextArea layouts are not synchronized with content layouts, which can create visual artifacts.
- Handling of the virtual keyboard is incomplete, and the display of the virtual keyboard is inconsistent and you can't specify the keyboard context.
- JSON and SQL data access doesn't implement saving, even if the function is available.
- You may experience some performance issues when creating screens with a large number of controls.
- The UI preview does not support custom controls in QML or custom elements in C++. Using custom controls or elements might result in a limited preview, or no preview, displayed in the UI preview.
- The QML preview does not work as expected when you open some QML files. You might experience issues with the QML preview, including disabling of the QML preview feature entirely, which could indicate that your hardware configuration is not supported. The QML preview requires a graphics card that supports 3-D acceleration and OpenGL 2.0 support. You might also experience issues if your graphics driver is outdated or obsolete, so it's recommended that you upgrade your graphics driver to try to resolve any issues with the QML preview. You can also disable the QML preview from within the QNX Momentics IDE in the Preferences menu. Also, note that the QML preview is not available if you access the QNX Momentics IDE using Remote Desktop or similar technologies, and you might experience limitations if you're running the IDE in a virtualized environment.
- The Create and export Button control is incomplete, and may not function when using Windows.
Cascades UI framework3630712
UIObject.attachedObjects.length returns a value of 0, even if objects have been attached.3628516
The first option of a SegmentedControl is not being selected when the selectedIndex has a value of 0. The first option should be selected by default when the selectedIndex is 0.3623776
A displayDirectionChanged signal is only triggered on the first instance of a display direction change, when it should be triggered on each rotation.3622193
Replacing an ImageView image causes the heap size to grow as if both images are still present. Replacing an ImageView image should delete the previous image and adjust the heap size accordingly.3593375
StandardListItem.imageSource returns an empty string when called, instead of returning the path to the source image.3582296
Scrolling past the top bounds of a scrollable container will cause the entire container area to turn white.3558816
SqlConnection transactions do not function correctly unless a transaction has already been executed. Workaround: Execute a query before starting a transaction.3556268
When using a TabbedPane, the first tabpage is appearing on the ActionBar when showTabsOnActionBar is set to 'false'.3552793
Public headers for WebLoadRequest and WebSettings are missing.3545884
SqlConnection::execute/executeAndWait(Insert Statement) is being executed twice, causing the database to be updated twice with new entries.3542367
Using nested StackLayout layouts may cause overlapping elements.3527827
The first letter of text in a Label can be clipped by the edge of the screen.3523678
Attempting to use NavigationPanes in a TabbedPane does not work correctly. The tabs are not displayed.3515020
Using horizontalAlignment: HorizontalAlignment.Fill on a button in a DockLayout does not fill the width of the screen, and can cause text used in the button to be clipped.3514830
Using horizontalAlignment: HorizontalAlignment.Fill on a button in a StackLayout does not fill the width of the screen with the button.3514817
Using horizontalAlignment: HorizontalAlignment.Fill on a button with varied text lengths in a StackLayout can cause the button to display improperly and not fill the width of the screen.3512901
Using spaceQuota on a button in a StackLayout can cause text to overlap the button.3484797
Inserting and removing items from a QListDataModel can result in an incorrect datamodel size and number of items displayed in the listview.3481382
The attachedChanged signal does not fire when an attached window is destroyed.3469244
onTextChanging registers a change if you change focus to another window, even if no change has occured.3469198
If ActionSet#setTitle is called when the ActionSet menu is visible, the UI is not updated.3467064
SegmentedControl does not update the display when an option has been moved from one control to another. The option remains in the initial control, and is placed in the target control.3428673
The header files for FontStyle, FontWeight, and FontStyleHint do not exist and can cause the following error when you attempt to compile: "error: bb/cascades/FontStyle: No such file or directory".3428166
Using SupportedDisplayOrientation::All can cause application orientation to be unresponsive when the device is rotated.3427602
SegmentedControl::resetSelectedIndex and SegementedControl::resetSelectedOption do not reset the control when used. These are intended to reset the control and select the first option in the list.3427080
An imageSourceChanged signal is not fired when an imageSource is set, or reset.3415323
Animations will appear to stutter or jump if Cascades is idle. Tapping the screen will bring Cascades out of idle and the animation will display correctly.3414323
Adding two ActionItems to a page, then adding that page to a tabbedPane, causes the Action Bar to not be visible to the user.3405801
A selectedIndexChanged signal is not being fired when an option is set, reset, or set by index.3398536
The text assigned to a drop-down option is not updating on the UI when another option is selected. The selectedIndex of the drop-down option is changing, but the text reflected on the UI is not.3373861
Attempting to insert a tabPane by using TabbedPane:Invoking insert(0, tabPane) results in a tabpage that appears empty. Selecting the tabpage will cause the contents to display.3245777
Attempting to add/insert a duplicate RadioGroupOption will cause RadioGroup->optionCount() to increase by 1, but the RadioGroupOption is not added visually to the control.3244920
GroupDataModel::RemoveAt returns true even if attempting to remove the header was unsuccessful.3231101
RadioGroupOption isSelected returns false when an option is selected via the RadioGroup setSelectedOption or setSelectedIndex APIs. RadioGroupOption isSelected should return true when an option is selected.3228577
RadioGroup.SelectedIndexNone returns 'undefined' in QML. The expected return for RadioGroup.SelectedIndexNone is '-1'.3228156
The QML RadioGroup Q_INVOKABLE_at function returns 'undefined' when invoked in QML3223580
Attempting to add/insert a tabPane which is already assigned to an existing TabbedPane results in the ownership remaining with the source TabbedPane.3213907
Attempting to use "QVariantList() << (negative integer)" as a parameter for DataModel::childCount, hasChildren, itemType, data causes the application to crash.3212523
QListDataModel::move triggers DataModel:updatedItem twice, when it should trigger DataModel:updatedItem only once.3207098
Image assets assigned to drop-down options are not being displayed in the drop-down list.3206167
QListDataModel::append() emits an itemAdded signal with incorrect indexPath value.3198300
When you get the file path from xmlDataModel using source(), the file path returned begins with two forward slash characters (//) that should not prepend the path.3193875
The clipContentToBounds property has no effect when it is set from QML, and can cause objects within a Container to be clipped if their size exceeds the bounds of the Container.3193126
QML - scrollMode is not registered in QML for container objects, and will return QMetaProperty::read: Unable to handle unregistered datatype 'bb::cascades::ScrollMode::Type' for property 'QDeclarativeBoundSignalParameters::newScrollMode' if called.3193101
QML - resetScrollMode is not available in QML for container objects.3192970
The bb::Cascades::Paint type is not registered in QML, and will return the following error message if called: QMetaProperty::read: Unable to handle unregistered datatype 'bb::cascades::Paint' for property 'QDeclarativeBoundSignalParameters::background'.3190445
Margins do not function correctly for any controls without a set value. When a control is initialized, or the margin is reset, the getMargin() function will not return a consistent value.3190444
Attempting to quickly stop and re-start an animation returns the following error message: ERROR: Animation: Failed to stop animation.3178884
resetLayout() should reset the container layout to StackLayout by default, instead returns a 'NULL' value.3176692
PreferredSize, PreferredHeight, LeftMargin, RightMargin, MinWidth are not functioning correctly with DateTimePicker.3163347
The titleChanged, valueChanged, and modeChanged signals for DataTimePicker are not being fired correctly, or at all, when subjected to their respective change.3160688
A three second UI lag occurs the first time you change the DateTimePicker's mode to 'DateTime'.3159146
More than one pane can be pushed from the same source pane simultaneously if you tap the control buttons quickly, causing the previous pane to be painted in the background of the current pane.3158040
The resetTopMargin(), resetBottomMargin(), resetLeftMargin(), resetRightMargin() do not trigger signals from topMarginChanged(), bottomMarginChanged(), leftMarginChanged(), rightMarginChanged() respectively for ProgressIndicator.3156065
In QML, the imageTracker.source always returns an empty string value, even if a source has been defined.3150612
Previously painted content can be seen briefly when the virtual keyboard opens.3139275
TextFields with a default sizing in LeftToRight Containers can push some Labels out of view by exceeding the bounds of the Container.3128997
Both setSelected and resetSelected do not update the UI with changes made to drop-down menu items, which can result in an empty drop-down being displayed.3091660
Setting the font color of a label that does not have a font size defined can cause a resizing of the font when two or more labels are present.
The ScalingMethod type is not registered in QML, and can lead to the following error if the onScalingMethodChanged signal handler is invoked: "QMetaProperty::read: Unable to handle unregistered datatype ' bb::cascades::ScalingMethod::Type' for property 'QDeclarativeBoundSignalParameters::scalingMethod".
Some options are still selectable after having their 'Option Enabled' status set to false.2992360
Attempting to call Application::setScene() to pass a setting's root can cause a segmentation fault error to be thrown.2988579
A Control::layoutPropertiesChanged signal is not being fired when resetLayoutProperties() is called, even though the layout properties have been reset in the control.2985208
Inserting a second tabPage by using myTabPane->insert(0,secPage); results in the second tabPage replacing the position of the first tabPage.2983994
Pages cannot be pushed to the NavigationPage more than once, and will display 'Cannot access memory at address 0x0' in the debug window upon multiple attempts.2981253
When a container is disabled, its ChildObjectsEnabled property remains set to true.2981241
A TextField does not render special characters properly.2981175
Tapping a TextField that is disabled/non-editable will still display the virtual keyboard.2981171
The first time a user taps a TextField in a Cascades application, the area above the TextField is painted white until the user forces a re-paint.2981143
The clear control of a default TextField does not clear the text when pressed.2981126
A TextArea field does not scroll up to display all entered characters when the virtual keyboard is displayed.2981125
Tapping on a TextArea after hiding the virtual keyboard does not display the virtual keyboard a second time.
Cascades platform APIs3621151
In the bb::platform::DigitalGoodResponse class, the methods digitalGoodId() and digitalGoodSku() return an empty string value, instead of the digital good ID. The header file states these methods will return the digital good ID if passed in the original request.3606315
On a BlackBerry 10 Dev Alpha device, the customization dialog for configuring digital goods is clipped in TestMode.3606249
Attempting to run a readyRead() signal on a PpsObject containing a large amount of data (/pps/services/wifi/status for example) results in no data being placed in the buffer.3590400
The bb::device::Led::colorChanged() signal is not being fired when the color of an LED is changed while the LED is flashing. The signal is detected when the color of an LED is changed when the LED is not flashing.3558709
Using bb::platform::Homescreen.setWallpaper() to set a .GIF file as wallpaper does not function correctly. The .GIF is not displayed, and the previous wallpaper is removed leaving no wallpaper on the home screen.3527483
Using the Display API, connecting to the signals fired by the primary display stops the ability to receive signals from the secondary display.3558122
NetworkStatus objects will emit a networkConnectedChanged() signal on the registered slot immediately when executing a connect statement. The registered slot should not be called immediately when executing the connect statement.3483069
Attempting to post two notification instances with prompt choices results in neither dialog being displayed. Attempting to post two notification instances without prompt choices displays two dialogs, as expected.
When using the Debug Perspective on a Mac, variable information is not appearing in the 'Variables View' after you run a debug on an application.3633870
Attempting to create and package a project with a name length greater than 25 characters will throw the following error: "Packaging failed:1 ... Error: Attribute Application-Name: value exceeds 25 chars", even though the name creation notification states that a project name can be 3 to 126 characters in length.3633843
Adding a 'Container' component to an empty Cascades project will cause the QML editor to notify the user of parsing errors, when no parsing errors exist.
Workaround: Close, then re-open the file.
In Cascades Builder, importing a .TMZ file with a text layer will cause Cascades to crash.3633743
When using the Debug Perspective on a Mac, stepping into the code during a debug can cause the debug session to hang.3629363
The QML wizard does not display the 'Finish' button, or an error message, if you attempt to create a file with a duplicate name in different case (a.qml and A.qml for example). The user is given no indication of the naming conflict, and cannot finish the file creation.3628816
It's not possible to browse for a file in the 'Image Source' text field of the Properties View.
Workaround: Specify the path manually.
Selecting the 'Properties' view with multiple QML components selected will display the properties of the QML component at the current caret location. Attempting to view the Properties of multiple QML components should result in a blank Properties view.3613963
Invoking code assist after 'background: Color' does not display the 'Color' context property. The user should be shown options (Red, Green, and Yellow), but nothing is displayed.
Workaround: Type R/G/Y after 'Color'.
Including a period (.) or a space in the project name will cause a binary error when you attempt to build the project as a simulator debug. A warning is not provided in the file creation wizard.3608228
On a BlackBerry 10 Dev Alpha device, attempting to debug a Cascades application over Wi-Fi can result in a timeout error which stops the debug session.3601213
Attempting to open a Cascades project in a VMware virtual environment can cause the IDE to crash unexpectedly.3596131
Invoking code assist after 'propertyBinding = SystemDefaults.TextStyles' returns a 'Null Pointer Exception' error instead of displaying the static properties of SystemDefaults.TextStyles.3596004
Invoking code assist after 'TextStyleDefinition' does not display 'onBaseChanged' as an option in the property list.3560257
Temporary preview files (.preview######qml.qml) are included in the .bar file during packaging.3560254
Temporary preview files (.preview######qml.qml) are included in the .ts translation files.3212426
When using Cascades Builder on Windows XP, overwriting or replacing an image in Cascades is not reflected in the design canvas.3160891
In Windows 7 (64-bit), the NVIDIA graphics card driver v191.25 does not support design mode in the QML editing perspective. Workaround: Install the latest drivers from the NVIDIA website.3147605
Attempting to use code assist for the first time in a project can cause code assist to function incorrectly, or not at all.
Workaround: Save, close, and re-open the project.
Attempting to display the values of Cascades specific objects in variable view or watch expression view during a debug does not display the values.
Cascades Exporter plug-in for Adobe Photoshop3547445
In Photoshop, in the rescaling dialog box, including a space in the scaling value ("2 4" for example) returns a 'Problem Null' error instead of informing the user that special characters are an invalid input parameter.3540237
[MAC] When working on two or more projects, attempting to undock one of the projects from the design window will cause Photoshop to crash.3225698
When exporting a .TMZ file that has a BB10 or Playbook button included, the .TMZ preview only displays a preview of the button. Also, if multiple buttons are added, the preview only shows the last button that was added to the file.3216416
When using the 9-slice tool in Photoshop, dragging the left guide over the right guide can result in errors with the positioning and errors with values returned by the 9-slice tool. Also, if you delete the layer being sliced and only display the background layer, sections of the 9-slice tool can still be seen.3200157
When exporting any file type from Photoshop, the 'Cancel' button cannot be clicked, and the operation cannot be stopped.3199307
Importing a BB10 or Playbook button with no specified text into Cascades causes the 'Text Property' to default to 'Null', when no 'Text Property' should be declared.
Workaround: Delete the 'Null' entry from the 'Text Property' field.
Using the 9-slice tool in Photoshop can cause window margins to decrease in size unexpectedly.