UWP-018 - XAML Layout with the SplitPanel

Sign in to queue

Description

The SplitPanel control is the second new layout control that helps you implement the hamburger style navigation. Bob will demonstrate how to show and hide, allow the user to peek at an icon that represents a menu option.

Lesson source code: https://github.com/Windows-Readiness/AbsoluteBeginnersWin10/tree/master/UWP-018/UWP-018

Full series source code: https://github.com/Windows-Readiness/AbsoluteBeginnersWin10

PDF: https://aka.ms/absBeginnerWin10pdf

Embed

Download

Download this episode

Download captions

The Discussion

  • User profile image
    Jockey4her

    too fast for beginners IMO.  Slow down. Talk much slower.  You are dealing with abstract new concepts as though we have any reference at all. Which we don't.  Also you are forgetting, these are universal. How does this affect the phone, the desktop, an IOT; hey all must be considered simultaneously.  What kind of apps is this not appropriate for?  How about a game?  How do we hide it, what if the display is too small, orientation changes.  Showing this material before you have even firmed up dealing with a page on all the platforms seems poorly outlined.

  • User profile image
    tvhong

    @Jockey4her:

    You are dealing with abstract new concepts as though we have any reference at all. Which we don't.

    I don't find this material is as challenging as you make it to be. For me, the SplitView layout is not at all an abstract concept, it's rather ... graphical. If you have seen the example application, the Money application, from last lecture, it'll be pretty clear what he was talking about (e.g. Pane, Content). In regard to the click event handler, he already talked about it in the first few lectures (lecture UWP-004 I think) where he demonstrated how clicking a button would show a text.

    How does this affect the phone, the desktop, an IOT; hey all must be considered simultaneously.  What kind of apps is this not appropriate for?  How about a game?  How do we hide it, what if the display is too small, orientation changes

    It's clear that you think a lot about how to apply these into real world applications and I think that's very nice. For me, I can kinda imagine what the splitview would behave in various screen sizes (including orientations) so that's not a big problem here.
    Though like you, I would also like to hear about Bob's experience when using these layouts. For example: "when should you use this?" and "what are the common problems to look out for?". 1 or 2 extra minutes for reflecting your experience worthwhile IMHO.

  • User profile image
    BobTabor

    @tvhong: Thank you for writing.  I think I say -- several times -- that our goal here is to create Windows 10 apps.  I even demonstrated their use in the stock apps that are distributed on Windows 10 (Money, Sports, Travel, etc. along with Settings and others).  If you've NOT used Windows 10, then you may need to spend time using it to really understand why the SplitView is important.  Looking through the transcripts of this lesson and the lessons leading up to this, I can see that I did talk about this and where we're headed --> creating hamburger style navigation.

    Outside of the "hamburger style navigation" I personally can't see any other practical use of this control.  When should you use this?  When you're working with a data intensive application and you intend to distribute your app via the Windows Store.

  • User profile image
    MNedelko

    Hi Bob
    Thank you VERY much for these truly great tutorial.

    I did run into an issue when following your steps though. When entering MySplitView.IsPaneOpen = !MySplitView.IsPaneOpen; I get a squggly red line beneath 'MySplitView' and when I click on the line it reads:

    The name MySplitView does not exist in the current context.

    Would you be happy to point me in the right direction as to how I might be able to address this?

    Mike

  • User profile image
    MNedelko

    MY bad! I found the error. I did not add the Name property to the <SplitView> tag. :--) . Thanks again for these amazing tutorials. They are really helpful!

  • User profile image
    ManjeetK

    I am actually starting my cheat sheet now, feels like i might just forget these things while actually designing my app. So it will be good if just had these options referable with just at glance at my cheat sheet.

    Thanks Bob, for the cheat sheet concept.

  • User profile image
    Shycs

    Things are getting harder as we move from Grid, StackPanel, RelativePanel and now SplitPanel. Me writing this to tell those who are struggling to keep their heads above the water.

  • User profile image
    leswatts

    Excellent presentation Bob.

    This is a beginning course in Windows 10 development. However the prerequisites for such an advanced course are not easily achieved. Many of the comments display inadequate experience to complete such a challenge.

     

  • User profile image
    JohnS2063

    @Shycs:

    Good advice, except you didn't tell us how to do that! (keep our heads above the water) ;)

    For anyone who is struggling with these lessons, hang in there! Just go back and watch the video over and over until you get it.

    In this video, Bob shows the button click method, which is something he teaches extensively in his C# courses, but just breezes through here. Although this course is labeled "... for Absolute Beginners", the first video in the series mentions that one should be comfortable using the techniques he taught in his C# for ASP.NET courses (about 1:00 in the first lesson)

    So (I guess) "Absolute Beginners" in this context means absolute beginners to developing apps for Windows 10, not necessarily absolute beginners to programming in general.

    Bob seems to be going a little fast in this lesson from my perspective, but then I'm what might be considered a slow learner. I had to review the first videos more than once to get through the Challenges so far, and I know I'll have to review these again, and again, before attempting the next Challenge.

    So if anyone reading this is getting frustrated, just do what I do and go back and re-watch the videos. After a while it will sink in.

    - john

     

  • User profile image
    chenjian198​91126

    thanks for john's advise and Bob's great work:D

  • User profile image
    Tolesy

    @MNedelko: You needed to name your splitvew inside the XAML code MySplitView.

Add Your 2 Cents