Tuesday, May 26, 2015

SplitView Control – A New XAML Control VisualStudio2015



SplitView Control – A New XAML Control

The Introduction


The very idea of  SpiltView originates from the Navigation Framework inside a XAML application.The navigation framework was introduced since Silverlight.The major components of the Navigation Framework were
1.Frame
2.Page
The Frame here is much like the browser which was used to contain a page which can be navigated back and forth.Here, the Front forward stack and the Back Stack.
They supported series of methods namely
1.GoBack()
2.GoForward()
3.CanGoBack()
4.CanGoForward()

But often its only about the navigation which the developers are concerned about. This is why you have SplitView . SplitView helps us navigate with “type” and not the URI which we used to do in Silverlight. Also, we don’t have to care the physical location of the file as well. 

The Page
The page has the two methods
1.OnNavigatedTo(Param)
2.OnNavigatedFrom()
These two overridden method which help us to navigate and hence help us to interact with the page.
 Although there are few more things worth noticing in Page.NavigationCacheMode which are primarily concerns of if the page is supposed to be created again or the same instance of the page will be rendered.

 Jumping with SpitView

SplitView is there for navigation affordance which means this gives a smoother way to navigate with menus and making the UI more smoother and fluid.

Where Do you use a SpiltView?



Universally this is Also know as the “Hamburger Menu” because it has two pieces of bread forming a nice Big Boy burger . But yes, That’s the split view. It’s a menu which takes care of a tons of problems a developer has while transiting from one page to another or simply just navigating from one part of the app to another.

Behaviors of a Split View

 
 
SplitView on taping pops out a menu and shows different options. Although its not mandate to have the Split View respond to tap request.






Where do you get the SplitView from?


The new Segoe Font will have the SplitView. All these are vectors and are oriented to Windows 10 Style.

 





Application of the SplitView

SplitView namely has 3 Properties
SplitView.Pane
SplitView.Content
SplitView.PaneDisplayMode


Lets Talk in details about SplitView.Pane


Pane is where the developer puts in all the buttons which are either on the left or the right of the Application.The Pane will also take in what kinds of buttons are going to be available for tapping  in the application.

The SplitView.Content



The most important property is the Content property. The Content Property sits over the frame and gives a navigation affordance. The Content also gives us a lot of grip with the overlay on the UI.

The SplitView.PaneDisplayMode



Depending on if you SplitView is open  or closed we have the PaneDisplayMode has its property.


The Inline when set to true will give a jolting experice to user as the content will shift the SplitView opens up. In case of the overlay although the content will not shift ,It will simply have the splitview menu coming out as a flyer over the content. The CompactInline will have the capabilities of shifting the content to a large extent if the SplitView is set to true or just have a sleek thin outline when set as false. The Compact overlay will have the same properties like the overlay only difference is in both the cases of Compact Overlay there will be a slight shift of content.

No comments:

Post a Comment