3

I'm trying to create a navigation bar using the SplitView control. I set it's DisplayMode property to CompactInline and two different values for CompactPaneLength and OpenPaneLength properties. Problem is when SplitView gets closed (compacted), content of it's Pane won't be aware of new size so if I put a let's say Border element in it, the element won't be stretched and goes out of the compact pane area:

 <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <SplitView IsPaneOpen="False" CompactPaneLength="100" OpenPaneLength="200" DisplayMode="CompactInline">
        <SplitView.Pane>
            <Border BorderBrush="Blue" Height="50"
                    BorderThickness="4"
                    VerticalAlignment="Top">
                <FontIcon Glyph="&#xE094;"
                          Width="40"
                          Height="40" />
            </Border>
        </SplitView.Pane>
    </SplitView>
</Grid>

Here is an image demonstrates the problem:

SplitView Pane

Question is: How to solve the problem without using the event handlers and code behind?

Mehrzad Chehraz
  • 5,092
  • 2
  • 17
  • 28

1 Answers1

0

Your compactPane width is set to 100 px. Since the border is not limited in width, it will strech, becoming 100 px. The content of border will center.

Set CompactPane width to 50, or the border width to 50 to resolve the issue

LostLogic
  • 61
  • 5
  • Sorry the image I was provided did not match the xaml code, I updated it, forget about '50'. Problem is the border control does not stretch, it's obvious since we cannot see it's right edge, and the content is not centered, besides, we can't give a fixed width to border control since it must resize when pane gets opened/closed. – Mehrzad Chehraz Apr 19 '15 at 16:45
  • The thing about SplitView Panel is that it does not resize it's content. It will just hide any overflowing content. – LostLogic Apr 20 '15 at 20:12
  • Yes, I was hoping there is a clean workaround for the problem. A tricky workaround is to use binding and converter, but since converter needs to access two properties (CompactPaneLength and OpenPaneLength) of the PaneView and multi-binding is not supported in winrt, it becomes a little tricky. – Mehrzad Chehraz Apr 20 '15 at 20:52
  • 1
    I've run some inspections on the SplitView control, but none expose the current width of the Pane. I'd wager you need to do some code behind / MVVM and tie the width to IsPaneOpen and Compact/OpenPaneLength. – LostLogic Apr 22 '15 at 07:56