I am using Gridsplitter control to give the flexibility of resizing the heights of a grid and a tab in a MVVM driven WPF application.
It is working with out any problem, but after I resize the height of any of the controls I navigate to some other screen and comes back to this screen I am losing the changes. The controls are again reset to their default heights.
Can somebody suggest me an efficient way of restoring the changes when we come back ?
This is the code I am using.
<igDP:XamDataGrid Grid.Row="1" Grid.Column="0" DockPanel.Dock="Top" />
<GridSplitter Grid.Row="2" HorizontalAlignment="Stretch"
VerticalAlignment="Center" Height="2"/>
<TabControl Grid.Row="3" Grid.Column="0" DockPanel.Dock="Top">
Thanks in advance.
First it would be nice to see actual code you can do that by pasting some code in your question and the use cyrly brackets under the yellow banner when you start typing ;-).
Secondly It seems like you could use binding with your ViewModel i.e. VM.UserSettings.TabHeight.
and then in .xaml
this is assuming
<Page or Window.DataContext>
<vm:ViewModel />
</Page or Window.DataContext>
<TabControl Height={Binding UserSettings.TabHeight}">
good luck :-)
Related
Disclosure:
I am new to WPF, about a week into it.
Problem:
I am trying to modify the behavior of a GridSplitter, to make it snap to interesting positions, to show a label (that follows the splitter) with current position, to have a context menu driven from said label, etc. I have prototyped all of this successfully on one gridsplitter in one simple test application, with a combination of XAML and some code behind.
Of note is that because the GridSplitter can't host content, I placed the label in the same grid cell as the splitter so that they move together.
So far so good....
Now I wish to replicate my work so that I can use my new GridSplitter functionality in place of the native control in many locations, and furthermore, I wish to have two variants, a horizontal and a vertical. Sounds like inheritance...create a subclass derived from GridSplitter and add in the additional functionality. But all of the reading I have done leaves me wondering how to go about this, and if this is even possible without starting over again and building my own GridSplitter from scratch?
Ideas welcome. Until then I will resume the fetal position.
Thanks
This answer might help you resolve your issue: How to make GridSplitter to "snap" into another element?
By subscribing to the GridSplitterDragCompleted event, you can insert your logic to snap to "interesting" positions.
You should
create a new control derived from GridSplitter.
subscribe to DragCompleted event to implement snapping functionality like DLeh mentioned.
add a few new properties for Label , ContextMenu etc.
supply a style for your new control.
This answers how to place content in the splitter
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="40" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Button Grid.Row="0" Content="Row 0" Background="Orange"/>
<!--<GridSplitter Grid.Row="1" VerticalAlignment="Center" HorizontalAlignment="Stretch" Height="20" Background="Purple"/>-->
<GridSplitter Grid.Row="1" VerticalAlignment="Center" HorizontalAlignment="Stretch">
<GridSplitter.Template>
<ControlTemplate TargetType="{x:Type GridSplitter}">
<TextBlock Text="TextBlock splitter" Background="Yellow" FontWeight="Bold"/>
</ControlTemplate>
</GridSplitter.Template>
</GridSplitter>
<Button Grid.Row="2" Content="Row 0" Background="Salmon"/>
</Grid>
I would like to display a popup above my control when the user 'mouse over', problem is that the contents of the popup is a ListBox that databinds so I do not know the size of the control (to set the margins), I have tried every event listed in intellisense on the popup but the ActualHeight of the popup is zero (want to subtract from Margin.Top), any ideas?
For this, I would recommend using a ToolTip. This way you can format the tool tip to show with a list box that is data bound. For example: A normal tooltip would look like:
<sdk:Label Content="{Binding SomeBinding}" Width="Auto" Height="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<ToolTipService.ToolTip>
<ToolTip Content="Some tool tip." Name="ttSomeToolTip"></ToolTip>
</ToolTipService.ToolTip>
</sdk:Label>
What I assume you're doing is this:
<sdk:Label Content="{Binding SomeToolTip}" Width="Auto" Height="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<ToolTipService.ToolTip>
<ToolTip Name="ttSomeToolTip">
<ListBox ItemsSource="{Binding MyListBoxSource}" SelectedItem="{Binding MySelectedListBoxItem,Mode=TwoWay}">
</ListBox>
</ToolTip>
</ToolTipService.ToolTip>
</sdk:Label>
I can't guarantee that this proposed solution will work, but you have one of two options: Target the LayoutUpdated event for the ToolTip and do a render transform matrix to resize the tool tip container. Theoretically, the tool tip should resize automatically. So if you're not already using the above mentioned approach, try that and see what happens.
You must run code via Dispatcher, then your code runs in UI thread and you have access to control size.
See here
I have a page in my WP7 app consisting of a TextBox beside a ListPicker. In their default modes, they don't line up properly; the ListPicker has a different padding to the TextBox, and its height is also different.
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<StackPanel Orientation="Horizontal">
<TextBox HorizontalAlignment="Left" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top"/>
<toolkit:ListPicker Width="170" ItemsSource="{Binding l}" Style="{StaticResource ListPickerStyle1}" VerticalAlignment="Top"/>
</StackPanel>
</Grid>
Manually tweaking the ListPicker's template to fit in correctly here is tricky and error prone. For example, when its height is adjusted, the caption (i.e. the text of the selected item) is no longer in the centre of the component.
My app is currently failing MS app review because the components are not all the same height.
Is there an easy way for me to set the toolkit:ListPicker to have the same appearance as a TextBox?
The simplest solution will be to take a copy of the the default style and tweak that using Blend to be exactly how you want it to look. This will take a little trial and error to sort out.
You can then use the implicit styling rules to apply it to all ListPickers without having to explicitly set the style on each instance:
<Style x:Key="MyListPickerStyle
TargetType="toolkit:ListPicker>
.... your tweaks here
</Style>
<Style TargetType="toolkit:ListPicker"
BasedOn="{StaticResource MyListPickerStyle}" />
It may be easier to tweak the TextBox Style of course :)
I am developing a simple WPF application without any auto layout. The goal is when a user clicks (mouse down) a element (say textBlock) will appear at the location of the mouse click. For this I am using canvas panel embedded in a Grid of 1 row, 1 column and scrollviewer (visible). The issues are:
1. when the application window is resized the scroll viewers do not become active.
2. I want the ability to auto grow the canvas with mouse drag. Something like in MS-Excel when user drags the mouse horizontally/vertically the canvas should grow.
I have searched net a lot to figure this out and am unable to get an answer. Any help in this regard would be great.
Thanks a bunch in advance.
-P
I after asking this question I figured it out how to have freeform layout and autosize. Here is a sample XAML if anyone needs it or has better suggestion to improve this:
<Ellipse Grid.Column="0" Fill="Red"/>
<GridSplitter Grid.Column="1" HorizontalAlignment="Stretch"/>
<!-- Creating a grid with one row and one column"-->
<ScrollViewer x:Name="ServerLiistCanvasScrollViewer"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto"
Height="Auto" Width="Auto"
Grid.Column="2" >
<Grid x:Name="drawingGrid" Grid.Column="2"
VerticalAlignment="Stretch" HorizontalAlignment="Stretch"
Background="Pink"
MouseDown="handleCanvasMouseDown">
</Grid>
</ScrollViewer>
</Grid>
I am working in a WPF application. And my problem is regarding the GridSplitter visiblity.
In my xaml code,I am maitaining a Grid. In the 3rd row of Grid, I am hosting a Winform DataGridView. In the same row, the GridSplitter is written.
When GridSplitter is dragged to adjust Grid Row sizes, for other controls like Buttons etc it is properly visible.
But when it comes over the DataGridView which I am hosting, the GridSplitter hides behind the hosted control.
In fact, whatever I host instead of Datagridview,makes the GridSplitter hide behind it, when it is dragged.
I tried setting the ZIndex for GridSplitter. It did not make any difference.
Can anyone help me with this?
Following is my XAML sample code:-
<Grid>
<Grid.RowDefinitions>
<RowDefinition Name="rowForButton"/>
<RowDefinition Name="rowForGridSplitter" Height="Auto" MinHeight="81" />
</Grid.RowDefinitions>
<Button Grid.Row="0" Height="50" Width="110" Content="Button in First Row"/>
<my:WindowsFormsHost Panel.ZIndex="0" Grid.Row="1" Margin="30,11,138,0" x:Name="winHost" Height="58" VerticalAlignment="Top" OpacityMask="Transparent">
<win:DataGridView x:Name="dataGridView"></win:DataGridView>
</my:WindowsFormsHost>
<GridSplitter BorderThickness="1" Panel.ZIndex="1" Grid.Row="1" HorizontalAlignment="Stretch" Height="5" ShowsPreview="True" VerticalAlignment="Top">
</GridSplitter>
</Grid>
Thanks.
Unfortuantely the WinForms control will always sit on top of your WPF elements, it does the same when you try and scroll it. The best way to work around it is to put the required logic for sizing/scrolling/whatever the WinForms part into a WinForms control, then host that control in the WPF form.
Your Grid has only 2 rowdefinitions but needs 3. At the moment the WindowsFormsHost and the GridSplitter are sharing the second row (i.e. Grid.Row="1"). Presumably you want the WindowsFormsHost to use Grid.Row="2".