ListView height in WPF - wpf

<Grid Height="525" MouseLeftButtonUp="ShowTextTrainerNote" Margin="20,0,30,0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ListView ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
Grid.Row="0"
ItemsSource="{Binding PlayerTrainerNote}"
Width="516" x:Name="trainerNoteListView"
ItemContainerStyle="{DynamicResource TrainerNoteListView}">
</ListView>
<DockPanel Visibility="Collapsed"
x:Name="dock" Background="White"
Grid.Row="1" LastChildFill="True">
<TextBox BorderBrush="{x:Null}" TextWrapping="Wrap"
x:Name="AddNotesTextBox"
ScrollViewer.VerticalScrollBarVisibility="Auto"
Width="516" KeyUp="SaveTrainerNote"/>
</DockPanel>
</Grid>
I want the listview height to be auto, but as soon as I populate with some data , the listview height is set to 525. I want to to be auto. How can I achieve this

Related

How do I set the ListView height to the height of the contining row in XAML

I can't figure out the syntax to tell the ListView its height is the height of the row that contains the ListView, that is, the ListView's Parent.
This is the xaml in the user control. I have put what I thought would work, but doesn't. I left it there so you would see what I am attempting.
<ListView Grid.Row="1"
Height="{Binding Path=Height,RelativeSource={RelativeSource AncestorType=Grid.Row}}"
ItemsSource="{Binding Folders}"
ItemTemplate="{StaticResource FolderListTemplate}"
SelectionMode="Single"
SelectedIndex="1"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Margin="3"
ScrollViewer.VerticalScrollBarVisibility="Visible"
ScrollViewer.CanContentScroll="True"
/>
Thanks,
Just set the RowDefinition height to Auto, here is my xaml:
<Grid Background="DimGray">
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<StackPanel Background="CornflowerBlue"/>
<ListView Grid.Row="1"
x:Name="ListView"
ItemsSource="{Binding Items}"
SelectionMode="Single"
SelectedIndex="1"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Margin="3"
ScrollViewer.VerticalScrollBarVisibility="Visible"
ScrollViewer.CanContentScroll="True"/>
<StackPanel Grid.Row="2" Background="CornflowerBlue"/>
</Grid>
And the output:
If you use star notation then the row it is goin to take the available height for the star value you gave, in this case 1* which is the same as *****.
If I modify to use star value as you:
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="*"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
The output:
Hope this helps

Accommodating height of textbox WPF application

I have a textbox and listview inside a grid in WPF app. What I want is, when the text overflows inside the textbox, the listview height should reduce accordingly to accommodate the textbox. Just like what happens in WhatsApp messenger when we type it in its textbox.
Here's my code:
<Grid MouseDown="ShowTextBox" Height="566" VerticalAlignment="Top" Margin="10,0,40,0" Background="White" Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ListView MaxHeight="544" VerticalAlignment="Top" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Disabled" S Grid.Row="0" Margin="20,0,0,0" x:Name="sessionNotesList" />
<TextBox Grid.Row="1" Height="Auto" MinHeight="100" MaxHeight="554" VerticalAlignment="Top" Margin="20,0,30,12" SpellCheck.IsEnabled="True" TextWrapping="Wrap" x:Name="sessionNoteContent" KeyUp="SaveNote" LostFocus="sessionNoteContent_LostFocus" />
</Grid>
Have you tried reversing the Grid.RowDefinitions so that the ListView takes all of the remaining space instead?:
<Grid MouseDown="ShowTextBox" Height="566" VerticalAlignment="Top" Margin="10,0,40,0" Background="White" Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<ListView MaxHeight="544" VerticalAlignment="Top" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Disabled" S Grid.Row="0" Margin="20,0,0,0" x:Name="sessionNotesList" />
<TextBox Grid.Row="1" Height="Auto" MinHeight="100" MaxHeight="554" VerticalAlignment="Top" Margin="20,0,30,12" SpellCheck.IsEnabled="True" TextWrapping="Wrap" x:Name="sessionNoteContent" KeyUp="SaveNote" LostFocus="sessionNoteContent_LostFocus" />
</Grid>

WPF DataGrid not showing scrollbars and running out of visible area

Like others I have a DataGrid that is not showing scrollbars. What I think is unique to my situation is that I do not see a StackPanel anywhere in the visual or logical tree. I am using WPF Inspector to view the trees. I have tried various suggestions to set the height and width of the containing Grid columns and rows with no success. I'm certain there is something I'm missing that is allowing the content to extend beyond the visible area but I cannot tell what it is yet. Any help would be appreciated. This application is a WPF Prism with MEF app and the DataGrid is within a UserControl which is in a Prism region.
Shell Window XAML:
<Window>
<Grid x:Name="GridOuterShell">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ribbon:Ribbon Grid.Row="0" >
...
</ribbon:Ribbon>
<Grid x:Name="GridShellContent" Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="350" MinWidth="300"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<local:RegionBorderControl Grid.Row="0" Grid.Column="0" Grid.RowSpan="3" Margin="2,2,8,2" RegionName="{Binding MainRegionDisplayName}"
Style="{DynamicResource RegionBorderControlStyle}">
<ContentControl prism:RegionManager.RegionName="MainRegion"
VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch"/>
</local:RegionBorderControl>
<GridSplitter Grid.Row="0" Grid.Column="1" Grid.RowSpan="3" HorizontalAlignment="Center" VerticalAlignment="Stretch"
Width="3" ShowsPreview="True" ResizeDirection="Columns" />
<local:RegionBorderControl Grid.Row="0" Grid.Column="2" RegionName="{Binding RightTopRegionDisplayName}"
Style="{DynamicResource RegionBorderControlStyle}">
<ContentControl prism:RegionManager.RegionName="RightTopRegion"
VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch"/>
</local:RegionBorderControl>
<GridSplitter Grid.Row="1" Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Center"
Height="3" ShowsPreview="true" ResizeDirection="Rows" ResizeBehavior="PreviousAndNext" Background="Silver"/>
<local:RegionBorderControl Grid.Row="2" Grid.Column="2" RegionName="{Binding RightBottomRegionDisplayName}"
Style="{DynamicResource RegionBorderControlStyle}">
<ContentControl prism:RegionManager.RegionName="RightBottomRegion"/>
</local:RegionBorderControl>
</Grid>
<StatusBar Grid.Row="2">
...
</StatusBar>
</Grid>
</Window>
UserControl XAML:
<UserControl>
<Grid x:Name="GridMain">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition />
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<DockPanel Grid.Row="0" LastChildFill="False" HorizontalAlignment="Stretch" Width="Auto" >
<ToolBar x:Name="tbToolBar" DockPanel.Dock="Left" Background="{x:Null}">
...
</ToolBar>
</DockPanel>
<DataGrid AutoGenerateColumns="False" Grid.Row="2" Name="DataGridList" ItemsSource="{Binding MyItems}" IsReadOnly="True" CanUserResizeRows="False" SelectionMode="Single"
SelectedItem="{Binding Path=SelectedDataGridRecord, Mode=TwoWay}" Style="{StaticResource DataGridDefault}" >
<DataGrid.Columns>
...
</DataGrid.Columns>
</DataGrid>
</Grid>
You have the DataGrid in a Grid row where the RowDefinition Height is auto so the grid will be measured with an infinite height and be arranged to its DesiredSize.Height and never show scrollbars. Seems like the grid should be in row 1 or make the height of row 2 to be * instead of auto.

Silverlight - Expander Control with ListBox, 100% Height

Im trying to put 4 expander controls inside a Grid with 4 rows, the expander control contains a Grid and a ListBox (Currently holding some sample data).
Ideally when an expander is expanded I want it to fill all the available space without pushing the remaining expanders off the screen or the list box going off the screen. Can anyone think of a way of adapting the XAML below or updating the XAML below to achieve this?
<Grid x:Name="LayoutRoot" Background="White" DataContext="{Binding Source={StaticResource ExpanderData}}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="0.246*"/>
<RowDefinition Height="0.754*"/>
</Grid.RowDefinitions>
<Grid Margin="0" Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.275*"/>
<ColumnDefinition Width="0.725*"/>
</Grid.ColumnDefinitions>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<toolkit:Expander x:Name="Expander1" Header="One" IsExpanded="False">
<Grid Background="#FFE5E5E5">
<ListBox Margin="0" ItemTemplate="{StaticResource ItemTemplate}" ItemsSource="{Binding Collection}"/>
</Grid>
</toolkit:Expander>
<toolkit:Expander x:Name="Expander2" Header="Two" IsExpanded="True" VerticalAlignment="Top" Grid.Row="1">
<Grid Background="#FFE5E5E5">
<ListBox Margin="0" ItemTemplate="{StaticResource ItemTemplate1}" ItemsSource="{Binding Collection}"/>
</Grid>
</toolkit:Expander>
<toolkit:Expander x:Name="Expander3" Header="Three" VerticalAlignment="Top" Grid.Row="2" IsExpanded="False">
<Grid Background="#FFE5E5E5">
<ListBox Margin="0" ItemTemplate="{StaticResource ItemTemplate2}" ItemsSource="{Binding Collection}"/>
</Grid>
</toolkit:Expander>
<toolkit:Expander x:Name="Expander4" Header="Four" VerticalAlignment="Top" Grid.Row="3" IsExpanded="False">
<Grid Background="#FFE5E5E5">
<ListBox Margin="0" ItemTemplate="{StaticResource ItemTemplate3}" ItemsSource="{Binding Collection}"/>
</Grid>
</toolkit:Expander>
</Grid>
</Grid>
</Grid>
</Grid>
</UserControl>
I'd probably use a DockPanel instead of a Grid - for Silverlight you'll have to get it from the Silverlight Toolkit (http://silverlight.codeplex.com) - I know you already have it, I'm just referencing it for the archives. Uncheck the "LastChildFill" property and dock all the children to Top.
It's tough to test without adequate data, but what if you just had one Expander open at a time and set the MaxHeight of each Expander to the remaining available space?

WPF grid row height doesn't match the height that I input

I've been pulling my hair out all day on this. For some reason when I set up my grid while I'm using some custom controls the actual height of the grid rows changes around and doesn't bother to use the height values that I give it. I originally thought it was because I was loading in custom controls in the code, but even when I take the custom controls out the problem remains. Here's what I have for the xaml
<Window x:Class="Pokemon_Planner.PokePlan"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="PokePlan" Height="600" Width="800">
<Grid x:Name="myGrid">
<Grid.RowDefinitions>
<RowDefinition Height="25" Name="row0"></RowDefinition>
<RowDefinition Height="Auto" Name="row1"></RowDefinition>
<RowDefinition Height="48" Name="row2"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="Auto"></ColumnDefinition>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Horizontal" Grid.Column="1" Grid.Row="0">
<ComboBox Name="cmbSort" Width="100">
<ComboBoxItem Content="Name"></ComboBoxItem>
<ComboBoxItem Content="Type"></ComboBoxItem>
<ComboBoxItem Content="Element"></ComboBoxItem>
<ComboBoxItem Content="BP"></ComboBoxItem>
<ComboBoxItem Content="Min Damage"></ComboBoxItem>
<ComboBoxItem Content="Max Damage"></ComboBoxItem>
</ComboBox>
<Button Name="btnSort" Click="btnSort_Click">Sort</Button>
<Button Name="btnRefresh" Click="btnRefresh_Click">Refresh</Button>
<Button Name="btnFilter">Filter</Button>
</StackPanel>
<StackPanel Grid.Column="0" Grid.Row="2" Orientation="Horizontal" VerticalAlignment="Top" Name="stkMoveSet1">
</StackPanel>
<StackPanel Grid.Column="0" Grid.Row="3" Orientation="Horizontal" Name="stkMoveSet2">
</StackPanel>
<ScrollViewer Grid.Row="1" Grid.Column="1" Grid.RowSpan="6" Height="Auto" Name="scrollViewerMoves" >
<StackPanel Grid.Row="1" Grid.Column="1" Grid.RowSpan="6" Name="moveStackPanel"></StackPanel>
</ScrollViewer>
</Grid>
The row that was set to have a height of 48 still had that height set, but the 'actual height' was 446 which is still really screwing my grid up. The numbers vary and I've tried a lot of different combinations between set numbers and auto but I can't seem to get this one window to behave correctly. Any ideas?
you might want to change "row2" grid row height definition to "auto" and set height to 48 for the "scrollViewerMoves" scrollviewer. Smth like this:
...
<RowDefinition Height="Auto" x:Name="row2"></RowDefinition>
...
<ScrollViewer Grid.Row="1" Grid.Column="1" Height = "48" Name="scrollViewerMoves" >
...
I guess this should do what you need,
regards

Resources