Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
770
Change PaneTabItem Width and Height depending on PaneLocation ?
posted

Hello,

We developed an application using XamDockManager and 3 content panes, intially docked on the left.

Free Web Proxy

The panes can also be docked at top or bottom, and the header is then displayed horizontally. That works fine.

Free Web Proxy

In order to standardize height and width between panes, we used a resource in the xaml code (targetting PaneTabItem) :

<ptr:MyForm.Resources>
<Style TargetType="{x:Type igDock:PaneTabItem}">
<Setter Property="Background" Value="White"/>
<Setter Property="Width" Value="25px"></Setter>
<Setter Property="Height" Value="120px"></Setter>
<Setter Property="HorizontalAlignment" Value="Left"></Setter>
<Setter Property="VerticalAlignment" Value="Center"></Setter>
</Style>
</ptr:MyForm.Resources>

Il looks good when docked on the left, but docked on top or bottom it's awful : height and width are still the same (which seems normal by the way).

Free Web Proxy

I tried Style triggers to detect the pane location (and invert width and height on the fly) : didn't work. (wrong syntax ? Wrong objects used ?)

<ptr:MyForm.Resources>
<Style TargetType="{x:Type igDock:PaneTabItem}">
<Setter Property="Background" Value="White"/>
<Setter Property="HorizontalAlignment" Value="Left"></Setter>
<Setter Property="VerticalAlignment" Value="Center"></Setter>
<Style.Triggers>
<Trigger Property="igDock:XamDockManager.PaneLocation" Value="DockedLeft">
<Setter Property="Width" Value="25px"></Setter>
<Setter Property="Height" Value="120px"></Setter>
</Trigger>
<Trigger Property="igDock:XamDockManager.PaneLocation" Value="DockedRight">
<Setter Property="Width" Value="25px"></Setter>
<Setter Property="Height" Value="120px"></Setter>
</Trigger>
<Trigger Property="igDock:XamDockManager.PaneLocation" Value="DockedTop">
<Setter Property="Width" Value="120px"></Setter>
<Setter Property="Height" Value="25px"></Setter>
</Trigger>
<Trigger Property="igDock:XamDockManager.PaneLocation" Value="DockedBottom">
<Setter Property="Width" Value="120px"></Setter>
<Setter Property="Height" Value="25px"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</ptr:MyForm.Resources>

I tried to catch PaneDragEnded event on the code behind, and change height and widtdh : I didn't manage to reach the PaneTabItem  of the ContentPane that is currently dragging. ContentPane doesn't have a direct link to "his" PaneTabItem, and although PaneTabItem has a "Pane" property, I don't see where all PaneTabItems could be listed for the DockManager...  


Is there a way to achieve what I want to do ? 



Many Thanks in advance,
Thomas 

Parents
  • 138253
    Verified Answer
    Offline posted

    Hello Thomas,

     

    Thank you for your post. I have been looking into it and I created a sample project for you with the functionality you want. Basically I used DataTriggers instead of Triggers and use the Name of the Panel that contains the PaneTabItems to determine, where the they are docked. Please let me know if this helps you or you need further assistance on this matter.

     

    Looking forward for your reply.

    XamDockMangerTabItemsHeightAndWidth.zip
Reply Children