Telerik blogs
The Q1 2015 release of UI for Windows Universal is the next step in our effort to provide developers with tools for building Windows Store apps. This release adds 4 new controls to the suite: ListView (beta), SideDrawer, LoopingList and a NumericBox.

ListView (beta)

The ListView control is an essential application building block for every platform. It’s what you first use to visualize your data. The Telerik ListView for Windows Store Apps supports all the major functionality inherent for such a control--handling large sets of data through UI virtualization, load on demand to update the data source with new items, item selection, filtering, grouping, sorting of the view model, various layout strategies such as horizontal, vertical and wrapped lists, item reordering, animations etc.

UI Virtualization

The ListView for Windows Store Apps supports custom UI Virtualization, a technique ensuring that the ListView creates only the containers which are visible in the viewable area. This reduces the memory footprint, speeds up the loading time of the application and enhances its UI responsiveness. UI virtualization is turned on by default.

Grouping, Sorting and Filtering

The data source of your application is what delivers content to your application’s interface. The ListView makes it easy for developers to perform sorting, filtering and grouping operations on their data.

Grouping

The ListView allows developers to group their app data by as many criteria as necessary. In addition, the ListView control provides an easy way to visualize and customize the group headers.



Sorting and Filtering

Sometimes it is necessary to reorganize your application data so you can easily find the information you're looking for. Sorting allows you to change or customize the order of your data whereas filtering helps you improve the performance of your app. 

Load on Demand

The ListView provides two ways of loading additional data: Auto and Explicit. 
If IncrementalLoadingMode is set to ”Explicit” a “Load more items” button will appear at the bottom of the scrollable list. When tapped it will notify the IncrementalLoadingCollection which in turn will fire an async function (see code below). You can use this async function to load as many new items as you need.
If IncrementalLoadingMode is set to ”Auto” the async function will be called when the end of the scrollable list has been reached.

Selection

The ListView supports both single and multiple selection.




Reordering of Items

The ListView provides an easy way to reorder items through a simple drag and drop action. Turning on this functionality can be done by setting the IsItemReorderEnabled property to true.

Layout Strategies

The ListView offers two built-in layout strategies which developers can use to specify how the items are arranged. The StackLayoutDefinition can be used to arrange items in vertical/horizontal scrolling list. The WrapLayoutDefinition displays the items in a wrapped grid.


Header & Footer

The Telerik ListView for Windows Store Apps supports the concept of Header and Foote, special containers above and below the ListView which you can use to display any type of content thus giving additional information to the end-user.



With this release we didn’t have the chance to include the “pull to refresh” functionality. It will be available with the Service Pack of Q1 when the ListView will be official.

There's a change we're introducing with this release. The DataBoundListBox and the ListView are now part of the Telerik.UI.Xaml.Controls.Data assembly. Previously the DataBoundListBox was the Primitives assembly. There's also a new binary we're introducing - Telerik.Data - a PCL that contains the data engine behind the DataBoundListBox and the ListView. With this change we're setting the foundations for the upcoming DataSource component and any other data control we'll introduce in the future.

Let us know what you think about the control on the ListView forum section.

SideDrawer

The SideDrawer is a panel that slides on top of the main application screen and presents the app’s major navigation options. The SideDrawer is an important application building block that enables quick and easy navigation across all levels of your app.


The SideDrawer can display any type of content and can be opened from any edge of the screen. Additional features include four built-in opening directions and six predefined open/close animations



The SideDrawer can be opened by both a swipe gesture and via code. Upon first launch of your app, it is a good practice to introduce the user to the navigation drawer by automatically opening it. This ensures that users know about the navigation drawer and prompts them to learn about the structure of your app by exploring its content. 

The SideDrawer can be dismissed both using code and through a user action such as touching the content outside the drawer, swiping opposite of the open direction, pressing the back button etc.

Let us know what you think about the control on the SideDrawer forum section.

LoopingList

The LoopingList for Windows Store apps allows developers to visualize data items in a single column with great performance and looping capability. The control uses its own UI virtualized data source to ensure the best possible performance and slick experience for the end-user. Support for more than one column is also available. Some of the features supported in Q1 2015 are:

  • turning the looping functionality on or off using a single boolean property - IsLoopingEnabled
  • horizontal and vertical orientation
  • snapping the closest item after the scrolling animation completes
  • collapsing the looping list so that it displays only the selected item
  • advanced item customization
  • read-only mode that disables end-user interaction. The control can still be controlled programmatically





Let us know what you think about the control on the LoopingList forum section.

NumericBox

The NumericBox (a.k.a. NumericUpDown) provides functionality for selecting numeric values from within a predefined range. Some of the features coming with the Q1 2015 release are:
  • Defining the scope of the range through the Minimum and Maximum properties
  • An Increment property for setting the amount by which Value changes when the user taps the spinner buttons or presses PageUp/PageDown on the keyboard
  • Setting custom String.Format on the Value property
  • Controlling the visibility of the spinner buttons through the ButtonsVisibility property
  • Read-only mode
  • Watermark support
Let us know what you think about the control on the NumericBox forum section.

What’s Next?

If you like what you've read so far, grab the bits from the download page and explore the documentation and sdk examples. We rely on your input to better shape our roadmap so we’d love to see your ideas on the product’s feedback portal or forum section

If you're into mobile development then take a look at what we've also included in our cross-platform suite Telerik UI for Xamarin.

TelerikNEXT 2015

TelerikNEXT is a gathering dedicated to equipping customers, partners and the broader community with insight on the Telerik products. There will be a lot of sessions on native mobile development and how to best utilize the Telerik mobile tools so if you’re interested, visit http://www.teleriknext.com

About the Author

Kiril Stanoev

Hi, I'm Kiril and I'm the Product Manager of Telerik UI for Android, Windows Universal and Windows Phone. Feel free to ping me on +KirilStanoev or @KirilStanoev

Comments

Comments are disabled in preview mode.