I have a grid, and within that grid I have the following:
<TabControl Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="3">
<TabItem Header="Weapons">
<ScrollViewer>
<DataGrid>
...
</DataGrid>
</ScrollViewer>
</TabItem>
</TabControl>
So, I have obviously taken out the stuff which isn't needed to show my problem. When the Datagrid fills up, the space it requires obviously grows. I intended this to fill down as far as it could go, and then the scrollviewer would do the rest. However, it seems to think it can have unlimited length, and the scrollviewer never actually scrolls.
I dont want to manually set a maxheight value, as there is moving content above the TabControl so it would change (plus window resizing etc). How would I get the scrollviewer to not expand further than the limits of the window / the parent grid to TabControl?
Condensed "full" xaml:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Grid.Column="1">
<Image Source="{StaticResource EmptySlot}" Margin="0" Width="34"/>
<Image Source="{Binding AuraSlot, FallbackValue={StaticResource AuraSlot}}" Margin="0" Width="34"/>
</Grid>
<Popup AllowsTransparency="True" Placement="Relative" PlacementTarget="{Binding ElementName=MainWindowName}" IsOpen="{Binding WeaponTooltipOpen}" HorizontalOffset="{Binding WeaponOffsetX}" VerticalOffset="{Binding WeaponOffsetY}" PopupAnimation="Fade" OpacityMask="White" >
...
</Popup>
<Grid Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="3">
<Expander orizontalAlignment="Center">
<Expander.Header>
<TextBlock Text="Equipment Slots" HorizontalAlignment="Center" />
</Expander.Header>
<Grid Grid.Row="0" Grid.Column="1">
...
</Grid>
</Expander>
</Grid>
<TabControl Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="3">
<TabItem Header="Weapons">
<Grid>
<ScrollViewer CanContentScroll="True" >
<DataGrid Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="3" ItemsSource="{Binding GroupedWeapons}" AutoGenerateColumns="False" IsReadOnly="True" AlternatingRowBackground="Gainsboro" AlternationCount="2" RowHeaderWidth="0">
<DataGrid.GroupStyle>
<GroupStyle>
...
</GroupStyle>
</DataGrid.GroupStyle>
<DataGrid.Columns>
...
</DataGrid.Columns>
<DataGrid.RowDetailsTemplate>
<DataTemplate>
<StackPanel>
...
</StackPanel>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
</DataGrid>
</ScrollViewer>
</Grid>
</TabItem>
</TabControl>
</Grid>
If you need vertical scrollbar try this or change to horizontalScrollBar. And CanContentScroll Property to true.
<TabControl Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="3">
<TabItem Header="Weapons">
<ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
<StackPanel Orientation="Vertical">
<GridView>
...
</GridView>
</StackPanel>
</ScrollViewer>
</TabItem>
</TabControl>
try if it works, or update me back.
Just try using it With window height if you want of the size of window. it will expand till it gets to the size of window.
Related
I have written a DataTemplate in App.xaml.
<DataTemplate x:Key="PlayDVBViewer">
<GroupBox Header="{x:Static properties:Resources.PlayInDVBViewer}" UseLayoutRounding="True" Margin="5">
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<TextBlock Text="{x:Static properties:Resources.ChooseDVBViewer}" Margin="5" VerticalAlignment="Center"/>
<ComboBox Grid.Row="1" ItemsSource="{Binding Clients.Items}" SelectedItem="{Binding Client}" SelectedValuePath="Name" DisplayMemberPath="Name" Margin="5" Padding="5" VerticalAlignment="Center" Background="Transparent"/>
<!--<Button Grid.Column="1" Grid.Row="1" x:Name="btnPlay" Click="BtnPlay_Click" Margin="5" Padding="5" VerticalAlignment="Center" Background="Transparent" Content="{x:Static properties:Resources.Playback}"/>-->
<Button Grid.Column="1" Grid.Row="1" Command="{Binding BtnPlayClick}" Margin="5" Padding="5" VerticalAlignment="Center" Background="Transparent" Content="{x:Static properties:Resources.Playback}"/>
</Grid>
</GroupBox>
</DataTemplate>
The template works correctly in a page. But on the same page, in a DataGrid, it doesn't work. Why?
<!--Wiedergabe Optionen -->
<GroupBox Header="{x:Static properties:Resources.Playback}" Grid.Row="1" Grid.Column="2" Margin="5">
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ContentPresenter Grid.Row="0" ContentTemplate="{StaticResource ResourceKey=PlayDVBViewer}" Content="{Binding}"/>
</Grid>
</GroupBox>
<DataGrid.RowDetailsTemplate>
<DataTemplate>
<Grid>
<!-- Detail Grid mit den Buttons zum Abspielen -->
<Grid Grid.Row="0">
<StackPanel Orientation="Horizontal">
<GroupBox Header="{x:Static properties:Resources.Picture}" MinWidth="120" Margin="5">
<Image Height="64" Source="{Binding ImagePath, Mode=OneWay, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:PageAufnahmen}}}" Margin="5"/>
</GroupBox>
<ContentPresenter ContentTemplate="{StaticResource PlayDVBViewer}"/>
</StackPanel>
</Grid>
</Grid>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
Ok, I have found the error.
If you use ContentPresenter in the DataTemplate of a grid. The binding will bind to the selected item. The solution is, use the same binding, like the image in the last box, see my post above.
I've got a big problem and I can't figure out how to solve it. I have a xaml layout:
<Hub x:Name="MainHub" DataContext="{x:Bind Model}" Margin="108,30,0,0">
<Hub.Resources>
<DataTemplate x:Key="HeaderTemplate">
<TextBlock Text="{Binding}" FontSize="26" FontWeight="Light" Foreground="#4B5054"/>
</DataTemplate>
</Hub.Resources>
<HubSection Header="News">
<HubSection.HeaderTemplate>
<StaticResource ResourceKey="HeaderTemplate"/>
</HubSection.HeaderTemplate>
<DataTemplate>
<Grid Margin="0,4,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="10" />
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<controls:VariableGridView x:Name="NewsGrid" Grid.Row="0" ItemsSource="{Binding News}">
<GridView.Resources>
<DataTemplate x:Key="NewsItemTemplate">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="188*" />
<RowDefinition Height="50*" />
<RowDefinition Height="57*" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<controls:WebImage ImageUri="{Binding Image, Mode=OneWay}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</Grid>
<Grid Background="#802A2B2D" Grid.Row="1">
<TextBlock Text="{Binding Title, Mode=OneWay}" Foreground="#D7D7D7" VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
</Grid>
<Grid Background="White" Grid.Row="2">
<TextBlock Text="{Binding Text, Mode=OneWay}" Foreground="#2A2B2D" VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
</Grid>
</Grid>
</DataTemplate>
</GridView.Resources>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid x:Name="TestGrid" Orientation="Vertical" MaximumRowsOrColumns="2"
ItemWidth="{Binding Width, ElementName=DummyNews, Mode=OneWay}" ItemHeight="{Binding Height, ElementName=DummyNews, Mode=OneWay}"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.ItemTemplate>
<StaticResource ResourceKey="NewsItemTemplate"/>
</GridView.ItemTemplate>
<GridView.ItemContainerStyle>
<Style TargetType="FrameworkElement">
<Setter Property="Margin" Value="0 0 15 15"/>
</Style>
</GridView.ItemContainerStyle>
</controls:VariableGridView>
<TextBlock VerticalAlignment="Bottom" Grid.Row="2" HorizontalAlignment="Right" Text="More >" FontSize="26" FontWeight="Light" Margin="0,0,15,0" Foreground="#4B5054" />
</Grid>
</DataTemplate>
</HubSection>
<HubSection Header="Featured Products">
<HubSection.HeaderTemplate>
<StaticResource ResourceKey="HeaderTemplate"/>
</HubSection.HeaderTemplate>
<DataTemplate>
<Grid/>
</DataTemplate>
</HubSection>
</Hub>
I have VariableSizedWrapGrid's width and height bound to code-behind models (item size changes when I resize a window):
ItemHeightVM.Value = (e.NewSize.Height - 200) / 2;
ItemWidthVM.Value = ItemHeightVM.Value / NEWS_WH_ASPECT;
This part working, but grid, specified in VariableGridView's data template don't fill whole item:
Widht and height not specified, grid do not fill parent container
But when I bind grid's width and height to my code-behind VM, or just specify width and height values, I've got right item size and right layouting, but only if item's rowspan and colspan are 1:
<DataTemplate x:Key="NewsItemTemplate">
<Grid Width="{Binding Width, ElementName=DummyNews, Mode=OneWay}" Height="{Binding Height, ElementName=DummyNews, Mode=OneWay}">
<Grid.RowDefinitions>
<RowDefinition Height="188*" />
<RowDefinition Height="50*" />
<RowDefinition Height="57*" />
</Grid.RowDefinitions>
When colspan or rowspan are 2 or more, margins are back :(
Bound to view model, colspan set to 2
Please, tell me how can I remove those margins and stretch my grid to fill whole item container if colspan (or rowspan) will be set to 2 or more? Hope that you can help me, I tried to solve this issue for a couple of hours and gave up
I have a page with lots of data so I need to use scrollviwer because of overflow items.
In this page I have something like list view (I made that) that has lots of items so I need to use scrollviewer for this list too.
So I have 2 vertical scrollviewer:
1) for all page items.
2) for My list view.
I made this app for windows phone 8.1. When I want to scroll in my list view I cant because of all page scrollviewer.
How can I solve that?
My code:
<ScrollViewer x:Name="ScrollViewerAllPage" Grid.Row="1" Grid.Column="0" Background="White" HorizontalScrollBarVisibility="Visible" ZoomMode="Disabled">
<Grid>
<StackPanel x:Name="StackMain" Orientation="Horizontal" Visibility="Collapsed">
...
<ScrollViewer x:Name="ScrollViewerReport" ScrollViewer.VerticalScrollMode="Enabled" Margin="32,0" Background="White" VerticalScrollBarVisibility="Visible" ZoomMode="Disabled" PointerPressed="ScrollViewerReport_PointerPressed">
<Grid x:Name="StackPanelReport" ScrollViewer.VerticalScrollBarVisibility="Visible" Margin="10,0" HorizontalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="70"/>
<ColumnDefinition Width="70" />
<ColumnDefinition Width="75" />
<ColumnDefinition Width="70" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Orientation = "Vertical">
...
</StackPanel>
</StackPanel>
<StackPanel Grid.Column="1" Orientation = "Vertical">
...
</StackPanel>
</StackPanel>
<StackPanel Grid.Column="2" Orientation = "Vertical">
...
</StackPanel>
</StackPanel>
<StackPanel Grid.Column="3" Orientation = "Vertical">
...
</StackPanel>
</Grid>
</ScrollViewer>
</StackPanel>
</Grid>
I am sorry for bad English.
Thanks.
So I am having some trouble getting the binding of a lisbox height to work. I have a user control that holds a listbox, this box is dynamically populated on the fly but it seems that if too many items are added it extends past the boundaries of the parent objects and refuses to stop and use the scoll bar...
<UserControl x:Class="TransaltionModule.Views.NoteView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d">
<Grid>
<ListBox ItemsSource="{Binding noteList}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="1*"/>
<RowDefinition Height="5*"/>
</Grid.RowDefinitions>
<StackPanel Orientation="Horizontal" Grid.Column="0">
<TextBlock Text="Type :" VerticalAlignment="Center" FontSize="14" Width="65"/>
<TextBox Text="{Binding noteType}" Width="auto" IsEnabled="False" VerticalAlignment="Center" FontSize="14"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Grid.Column="1" HorizontalAlignment="Right">
<TextBlock Text="Date :" VerticalAlignment="Center" FontSize="14" Width="65"/>
<TextBox Text="{Binding timeStamp}" Width="auto" IsEnabled="False" VerticalAlignment="Center" FontSize="14"/>
</StackPanel>
<TextBlock Grid.Row="1" Text="{Binding text}" Grid.ColumnSpan="2"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
If i hardcode the maxheight property everything works as intended, but with the multiple display resolutions I will be working against that is not a solution I can use. Can anyone recommend a fix
You can bind it to an element by using Path=ActualHeight
For this to work don't forget to name the Grid containing the Listbox
Try something like this :
<Grid x:Name = "grdListBoxTest">
<ListBox x:Name="lstBoxTest"
MaxHeight="{Binding ElementName=grdListBoxTest, Path=ActualHeight}">
<!-- Your Listbox Stuff Here -->
</ListBox>
</Grid>
By doing this you link the height of the Listbox to it's parent Grid. That way if the grid's size changes the MaxHeight of the Listbox will change.
I've got 2 listbox and one scrollviewer and I want the scrollviewer to scroll the two listbox together. But i don't know how to do.. Here's my xaml :
<ScrollViewer Grid.Row="1">
<Grid>
<ListBox Name="listboxRSSFeedItems" Width="240" Height="644" Margin="0,0,240,0">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" Grid.Row="0" FontSize="24" HorizontalAlignment="Left" />
<HyperlinkButton Content="Link to details" NavigateUri="{Binding Link}" HorizontalAlignment="Left" Grid.Row="1" Margin="0,0,0,30" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<ListBox Name="listboxRSSFeedItems2" Width="240" Height="644" Margin="240,0,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" Grid.Row="0" FontSize="24" HorizontalAlignment="Left" />
<HyperlinkButton Content="Link to details" NavigateUri="{Binding Link}" HorizontalAlignment="Left" Grid.Row="1" Margin="0,0,0,30" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</ScrollViewer>
Thanks a lot
Ok. I just tried to do one listbox with grid. it works fine, but how to choose which grid to add my item.
I used to add with "listboxRSSFeedItems.Items.Add(item)", but now, how can i choose the 2nd Column only.
<ScrollViewer Grid.Row="1">
<ListBox x:Name="listboxRSSFeedItems" Width="480" Height="680">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid x:Name="first" Grid.Column="0">
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" />
<HyperlinkButton NavigateUri="{Binding URL}" TargetName="_blank"/>
</Grid>
<Grid x:Name="second" Grid.Column="1">
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" />
<HyperlinkButton NavigateUri="{Binding URL}" TargetName="_blank" />
</Grid>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>
Thanks again
You shouldn't set height of your listBoxes.
ps: Consider layout using columns
<ScrollViewer >
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<ListBox x:Name="first" Grid.Column="0" />
<ListBox x:Name="second" Grid.Column="1" />
</Grid>
</ScrollViewer>
Set VerticalScrollBarVisibility to "Disabled" for listBoxes.
And it will be better using StackPanel for this puprose instead of Grid.