Inside: Style for Orientation=Bottom

Jul 5, 2012 at 11:23 AM
Edited Jul 5, 2012 at 12:04 PM

I played a bit with the NavigationPaneExpander.Orientation and found out, that Bottom (and top) are available, but not implemented.

It might not be perfect, but for your convenience, please note following changes necessary,
in case you want to support Bottom-Style :)

 

Edit1: Added two Lines. In MultiTrigger. Still ToDo: Expander-Arrows should not be on top of the Content, but left.

 

NavigationPane.xaml -> Style for NavigationPaneExpander

 

<Trigger Property="Orientation" Value="Bottom">
    <Setter Property="HorizontalAlignment" TargetName="PART_ContentHost" Value="Left"/>
    <Setter Property="Placement" TargetName="PART_Popup" Value="Top"/>
    <Setter Property="VerticalOffset" TargetName="PART_Popup" Value="{Binding -Height, ElementName=PART_ContentHostContainerExpanded}"/>
    <Setter Property="Height" TargetName="PART_Popup" Value="{Binding Height, ElementName=PART_ContentHostContainerExpanded}"/>
    <Setter Property="Width" TargetName="PART_Popup" Value="{Binding ActualWidth, ElementName=PART_MininizedSizeProvider}"/>
    <Setter Property="Fill" TargetName="arrow" Value="{DynamicResource {ComponentResourceKey ResourceId=ArrowRight, TypeInTargetAssembly={x:Type local:NavigationPane}}}"/>
    <Setter Property="Anchor" TargetName="PART_MininizedSizeProvider" Value="Bottom"/>
    <Setter Property="HorizontalAlignment" TargetName="PART_MininizedSizeProvider" Value="Left"/>
    <Setter Property="DockPanel.Dock" TargetName="buttons" Value="Top"/>
    <Setter Property="HorizontalAlignment" TargetName="dockPanel" Value="Left"/>
    <Setter Property="BorderThickness" TargetName="border1" Value="{DynamicResource {ComponentResourceKey ResourceId=TitleInnerLeft, TypeInTargetAssembly={x:Type local:NavigationPane}}}"/>
    <Setter Property="HorizontalOffset" TargetName="PART_Popup" Value="4"/>
    <Setter Property="DockPanel.Dock" TargetName="headers" Value="Top"/>
    <Setter Property="DockPanel.Dock" TargetName="PART_ResizeThumb" Value="Top"/>
</Trigger>

 

 

<MultiTrigger>
    <MultiTrigger.Conditions>
        <Condition Property="IsMinimized" Value="False"/>
        <Condition Property="Orientation" Value="Bottom"/>
    </MultiTrigger.Conditions>
    <Setter Property="Fill" TargetName="arrow" Value="{DynamicResource {ComponentResourceKey ResourceId=ArrowDown1, TypeInTargetAssembly={x:Type local:NavigationPane}}}"/>
</MultiTrigger>
<MultiTrigger>
    <MultiTrigger.Conditions>
        <Condition Property="IsMinimized" Value="True"/>
        <Condition Property="Orientation" Value="Bottom"/>
    </MultiTrigger.Conditions>
    <Setter Property="Fill" TargetName="arrow" Value="{DynamicResource {ComponentResourceKey ResourceId=ArrowUp, TypeInTargetAssembly={x:Type local:NavigationPane}}}"/>
    <Setter Property="HorizontalAlignment" TargetName="dockPanel" Value="Left"/>
   <Setter Property="Width"  TargetName="PART_MininizedSizeProvider" Value="{Binding ActualWidth, ElementName=border2}"/>
   <Setter Property="HorizontalContentAlignment"  TargetName="PART_MininizedSizeProvider" Value="Left"/>
 </MultiTrigger>

 

Office 2007 -> Common.xaml

(Copied ArrowLeft and Used a RotateTransform. Maybe not perfect, but faster for me to design. running out of time ^^)

 

   <DrawingBrush x:Key="{ComponentResourceKey ResourceId=ArrowUp, TypeInTargetAssembly={x:Type local:NavigationPane}}" Stretch="None">
        <DrawingBrush.Drawing>
            <DrawingGroup>
                <DrawingGroup.Children>
                    <GeometryDrawing Geometry="F1 M 55.7393,23.0005L 52.7393,20.0021L 55.7393,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FFFFFFFF"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                    <GeometryDrawing Geometry="F1 M 60.7893,23.0005L 57.7893,20.0021L 60.7893,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FFFFFFFF"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                    <GeometryDrawing Geometry="F1 M 54.7393,23.0005L 51.7393,20.0021L 54.7393,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FF000000"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                    <GeometryDrawing Geometry="F1 M 59.7893,23.0005L 56.7893,20.0021L 59.7893,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FF000000"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                </DrawingGroup.Children>
            </DrawingGroup>
        </DrawingBrush.Drawing>
        <DrawingBrush.RelativeTransform>
            <RotateTransform Angle="90" CenterX="0.5" CenterY="0.5"/>
        </DrawingBrush.RelativeTransform>
    </DrawingBrush>

    <DrawingBrush x:Key="{ComponentResourceKey ResourceId=ArrowDown, TypeInTargetAssembly={x:Type local:NavigationPane}}" Stretch="None">
        <DrawingBrush.Drawing>
            <DrawingGroup>
                <DrawingGroup.Children>
                    <GeometryDrawing Geometry="F1 M 55.7393,23.0005L 52.7393,20.0021L 55.7393,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FFFFFFFF"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                    <GeometryDrawing Geometry="F1 M 60.7893,23.0005L 57.7893,20.0021L 60.7893,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FFFFFFFF"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                    <GeometryDrawing Geometry="F1 M 54.7393,23.0005L 51.7393,20.0021L 54.7393,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FF000000"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                    <GeometryDrawing Geometry="F1 M 59.7893,23.0005L 56.7893,20.0021L 59.7893,17.0005">
                        <GeometryDrawing.Pen>
                            <Pen StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="#FF000000"/>
                        </GeometryDrawing.Pen>
                    </GeometryDrawing>
                </DrawingGroup.Children>
            </DrawingGroup>
        </DrawingBrush.Drawing>
        <DrawingBrush.RelativeTransform>
            <RotateTransform Angle="-90" CenterX="0.5" CenterY="0.5"/>
        </DrawingBrush.RelativeTransform>
    </DrawingBrush>

 

Office 2010 -> Common.xaml

(Same here, but I had to use ArrowDown1, because ArrowDown was already used)

    <DrawingBrush x:Key="{ComponentResourceKey ResourceId=ArrowUp, TypeInTargetAssembly={x:Type local:NavigationPane}}" Stretch="None">
        <DrawingBrush.Drawing>
            <DrawingGroup>
                <GeometryDrawing Geometry="F1 M 55.0817,60.5001L 52.0817,57.5017L 55.0817,54.5001">
                    <GeometryDrawing.Pen>
                        <Pen Thickness="1" StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="{DynamicResource {ComponentResourceKey ResourceId=ForeColorActive, TypeInTargetAssembly={x:Type local:NavigationPane}}}"/>
                    </GeometryDrawing.Pen>
                </GeometryDrawing>
            </DrawingGroup>
        </DrawingBrush.Drawing>
        <DrawingBrush.RelativeTransform>
            <RotateTransform Angle="90" CenterX="0.5" CenterY="0.5"/>
        </DrawingBrush.RelativeTransform>
    </DrawingBrush>
 
    <DrawingBrush x:Key="{ComponentResourceKey ResourceId=ArrowDown1, TypeInTargetAssembly={x:Type local:NavigationPane}}" Stretch="None">
        <DrawingBrush.Drawing>
            <DrawingGroup>
                <GeometryDrawing Geometry="F1 M 55.0817,60.5001L 52.0817,57.5017L 55.0817,54.5001">
                    <GeometryDrawing.Pen>
                        <Pen Thickness="1" StartLineCap="Round" EndLineCap="Round" LineJoin="Round" Brush="{DynamicResource {ComponentResourceKey ResourceId=ForeColorActive, TypeInTargetAssembly={x:Type local:NavigationPane}}}"/>
                    </GeometryDrawing.Pen>
                </GeometryDrawing>
            </DrawingGroup>
        </DrawingBrush.Drawing>
        <DrawingBrush.RelativeTransform>
            <RotateTransform Angle="-90" CenterX="0.5" CenterY="0.5"/>
        </DrawingBrush.RelativeTransform>
    </DrawingBrush
>