I'm facing problem with scrolling content in Dock panel .
My controls placed in 'DockPanel' as below
<DockPanel>
<ScrollViewer>
<StackPanel>
<!-- Here controls are like Radiobutton,Lable ,CheckBox,Textblock are added dynamically in grid.-->
</StackPanel>
</ScrollViewer>
I'm using only vertical scrollbar, not need horizontal scrollbar,
When I first time traverse through controls in 'DockPanel' by using tab ,Tab focus goes off the screen but panel is not scrolling down.
Please help me out I'm really stuck over here.
Thanks in advance.
Add IsTabStop="True" in Scrollviewer:
<DockPanel>
<ScrollViewer IsTabStop="True" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
<StackPanel></StackPanel>
</ScrollViewer>
</DockPanel>
Related
I have creating a wpf application and in my settings panel I have tons of UI elements. The problem is that when I resize the window some of these elements are not visible anymore. Is there any way to add a simple vertical scrollbar?
I have tried this below and add my content into it :
<ScrollViewer VerticalScrollBarVisibility="Auto">
<Grid>
<StackPanel>
//Content
</StackPanel>
</Grid>
</ScrollViewer>
I'm not sure if I put the ScrollViewer to the right Place but I got this error :
The member resources is not recognized or is not accessible
and for this error I have tried to replace the Page.Resources with Window.Resources but it did not help.
Anyways how could I get my vertical scrollbar working? Any helps?
Problem solved by removing the Width and Height properties from the Page.
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Height="800" Width="1400"
WindowTitle="ScrollViewer Sample">
<ScrollViewer VerticalScrollBarVisibility="Auto">
<Grid>
<StackPanel>
//Content
</StackPanel>
</Grid>
</ScrollViewer>
</Page>
You should get rid of the StackPanel. A StackPanel measures its children with an infinite space and therefore it doesn't work very well with scroll bars:
Horizontal scroll for stackpanel doesn't work
I want to make it so that my TabControl is vertically scrollable, but I can't seem to do it. The following sample acts as though there was no scrollviewer at all. I even tried putting the TabControl inside the scrollviewer, or putting it all in a grid and constraining the height of the grid, but nothing works.
<DataTemplate x:Key="tabControlTemplate">
<TabControl ItemsSource="{Binding guiItems}" DisplayMemberPath="Title" Height="Auto" Template="{StaticResource mainTabControlTemplateEx}">
<TabControl.ContentTemplate>
<DataTemplate>
<ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
<StackPanel Margin="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<ItemsControl ItemsSource="{Binding guiItems }" ItemTemplateSelector="{DynamicResource templateSelector}"/>
</StackPanel>
</ScrollViewer>
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
</DataTemplate>
The actual problem is not clear from the question.
You are not getting to see scrollviewer and the content inside is clipped? PLease confirm if that is the case.
If the problem is you are getting to see entire content taking up all the available space, and you would like to control that using scroll viewer, then you would need to set 'MaxHeight' property on Scroll Viewer. This would limit the height of your DataTemplate and would make verticall scroll bar visible if the inner content goes beyond the MaxHeight.
Hope that helps.
I have a little problem. I want to put a view inside a stackPanel with a scrollbar. Basically, this is how I try to do this :
<DataTemplate x:Key="FirstTemplate">
<vw:FirstView DataContext="{Binding}"></vw:FirstView>
</DataTemplate>
<DataTemplate x:Key="SecondTemplate">
<vw:SecondView DataContext="{Binding}"></vw:SecondView>
</DataTemplate>
<DataTemplate x:Key="ThirdTemplate">
<vw:ThirdView DataContext="{Binding}"></vw:ThirdView>
</DataTemplate>
<selector:DimensionTemplateSelector x:Key="SomeTemplateSelector"
FirstTemplate="{StaticResource FirstTemplate}"
SecondTemplate="{StaticResource SecondTemplate}"
ThirdTemplate="{StaticResource ThirdTemplate}">
</selector:DimensionTemplateSelector>
<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
<StackPanel>
<ContentControl ContentTemplateSelector="{StaticResource SomeTemplateSelector}"
Content="{Binding ASelectedValue}" />
</StackPanel>
</ScrollViewer>
The problem with this code is that I can scroll with the mouse wheel only if my mouse is over the scrollbar zone. If my mouse is inside the stackPanel (so, inside the ScrollViewer tags) but not directly over the scrollbar zone, trying to scroll with the mouse wheel won't result in anything.
I'm very not sure, but it seem like I should define a behaviour to my contentControl so it can handle scrolling. Anyone know how to do that or have a better explanation ?
Thank you
Page scrolls without any issue when the mouse is over data grid. If the mouse outside datagrid page doesn't scroll.
<navigation:Page>
<Grid x:Name="LayoutRoot" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<ScrollViewer x:Name="scrollMainQueue" VerticalScrollBarVisibility="Auto" >
<StackPanel>
<StackPanel>
</StackPanel>
.......
<StackPanel>
<data:DataGrid AutoGenerateColumns="False" Name="grdWorkingDocs" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" MinHeight="50" Margin="5,0,5,5" CanUserResizeColumns="False" CanUserReorderColumns="False" LoadingRow="grdWorkingDocs_LoadingRow" AlternatingRowBackground="White" RowBackground="White" HorizontalGridLinesBrush="White" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Disabled" />
</StackPanel>
</StackPanel>
......
</StackPanel>
</ScrollViewer>
</Grid>
scrollMainQueue.SetIsMouseWheelScrollingEnabled(true);
After some research Got the answer.
Basically we need to set the background color to the scrollviewer. It worked after that.
<ScrollViewer x:Name="scrollMainQueue" VerticalScrollBarVisibility="Auto" Background="White">
Answer is as mentione above. Applied background color to scrollviewer made is scrollable.
Background="Transparent" also works, if you can't use any color because of your design requirements.
I was using the Content Control to hold the inner view wrapped up with scroll viewer, the scroll viewer was only working on mouse wheel when the pointer is on any field and not on the empty area.
After seeing the above posts, I set the background color and it started working fine, though the solution looks unrelated [don't know how exactly related to the problem].
I've got two sizing issue regarding a Window I've got. The basic layout is like this
<Window MaxHeight="{DynamicResource {x:Static SystemParameters.VirtualScreenHeight}}"
MaxWidth="{DynamicResource {x:Static SystemParameters.VirtualScreenWidth}}"
>
<StackPanel>
<DockPanel LastChildFill="False">
<StackPanel DockPanel.Dock="Left"
Orientation="Horizontal">
<!--Some buttons-->
</StackPanel>
<StackPanel DockPanel.Dock="Right"
Orientation="Horizontal">
<!--Some buttons-->
</StackPanel>
</DockPanel>
<ScrollViewer>
<WrapPanel x:Name="Container">
</WrapPanel>
</ScrollViewer>
</StackPanel>
</Window>
1) How do I made the Window not get smaller horizontally than the DockPanel's width?
2) How do I make the ScrollViewer be restricted to the limits of the Window? It is sizing itself to its contents, extending past the bounds of the Window.
It sort of used to work when I had
<Window><ScrollViewer/></Window>
, but I really don't want the DockPanel inside the scroller. In the current form, it is even forcing the Window to break its MaxHeight.
I would recommend you to use Grid with * Lenght instead of DockPanel and StackPanel.
Just get rid of those StackPanels. Replace them with Grids and you should be good. The layout logic of the StackPanel is such that it will give children as much room in a certain direction (perpendicular to the StackPanels orientation) as they ask for. That's why you're seeing the odd layout issues.