How can I use scrollviewer to make it resizable when created button get off screen?
So basically I have a button that creates button on the right side after let's say 20 clicks my buttons becoming hidden because they become too many to fit in screen. So I wanted to use a scrollviewer so that I can use the scrollbar to view the hidden created buttons that I have created?
I also use grid with definition so I must set on scrollviewer the row and columns
Re: How can I use scrollviewer to make it resizable when created button get off scree
Put the buttons into a StackPanel. Set the height to a fixed value (this will cause the scroll bar to appear when the number of buttons exceed the visible area set by the height).
Re: How can I use scrollviewer to make it resizable when created button get off scree
Quote:
Originally Posted by
Arjay
Put the buttons into a StackPanel. Set the height to a fixed value (this will cause the scroll bar to appear when the number of buttons exceed the visible area set by the height).
Your info is innacurate.
You said put the buttons in a stackpanel and the scrollviewer where? outside of stackpanel?
Code:
<Border Padding="10">
<Grid x:Name="GategoryGrid">
<Grid.RowDefinitions>
<RowDefinition Height="140"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ScrollViewer>
<StackPanel Grid.Row="0" Height="100">
<!--Content-->
<Button>Text</Button>
<Button>Text</Button>
</StackPanel>
</ScrollViewer>
</Grid>
</Border>
Re: How can I use scrollviewer to make it resizable when created button get off scree
It's been 8 years or so since I've coded WPF, so the memory is failing...
Fortunately, WPF is easy and there is plenty of help to google. Below code dynamically adds a button to a stack panel and the scrollbar gets added when there are more than 8 button items.
Note: I didn't dynamically add button handlers - there are several approaches to this. In a real app, you'll want to be able to tell which button click on the handler (even though you can use the same handler for all the buttons).
Code:
<Window x:Class="WpfApp1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp1"
mc:Ignorable="d"
Title="MainWindow" Width ="275" Height="275">
<Grid x:Name="CategoryGrid" Width="250px" >
<Grid.RowDefinitions>
<RowDefinition Height="200"/>
<RowDefinition Height="35"/>
</Grid.RowDefinitions>
<Border BorderThickness="1" BorderBrush="Black">
<ScrollViewer Padding="20" Grid.Row="0" Height="200" VerticalScrollBarVisibility="Auto">
<StackPanel x:Name="CategoryStackPanel" Orientation="Vertical">
</StackPanel>
</ScrollViewer>
</Border>
<Button Grid.Row="1" Height="20" Width="100" Click="Button_Click">Add Button</Button>
</Grid>
</Window>
C#
Code:
namespace WpfApp1
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
CategoryStackPanel.Children.Add(new Button() { Content = $"Button: {++ButtonCount}" });
}
private int ButtonCount { get; set; }
}
}
Re: How can I use scrollviewer to make it resizable when created button get off scree
Quote:
Originally Posted by
Arjay
The StackPanel inherits from ScrollViewer. If you use a StackPanel and set the Height property as I have I posted, a vertical scrollbar will appear as you add buttons to the StackPanel.
Code:
<Border Padding="10">
<Grid x:Name="CategoryGrid">
<Grid.RowDefinitions>
<RowDefinition Height="140"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Height="100">
<!--Content-->
<Button>Text</Button>
<Button>Text</Button>
<Button>Text</Button>
<Button>Text</Button>
<Button>Text</Button>
<Button>Text</Button>
</StackPanel>
</Grid>
</Border>
This is how i managed it on my own :D but thanks for help!
Code:
<Border>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="140"/>
<RowDefinition Height="140"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="140"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Grid.Column="0" Grid.Row="0" Margin="10,0,0,0" Height="100" Content="AddCategory" Click="AddCategory_Click" />
<ScrollViewer Grid.Column="1" Grid.Row="1" Name="ScrollViewer1" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Visible" CanContentScroll="True">
<StackPanel Name="StackPanel1" OverridesDefaultStyle="False" VerticalAlignment="Top" HorizontalAlignment="Left">
<Grid x:Name="GategoryGrid">
<!--Content-->
</Grid>
</StackPanel>
</ScrollViewer>
<Label Content="This is userControl" Grid.Column="1" HorizontalAlignment="Left" Height="100" Margin="61,174,0,-133" Grid.Row="1" VerticalAlignment="Top" Width="496" FontSize="50"/>
</Grid>
</Border>
Re: How can I use scrollviewer to make it resizable when created button get off scree
Try the updated version, but glad you figured it out.
Re: How can I use scrollviewer to make it resizable when created button get off scree
Quote:
Originally Posted by
Arjay
It's been 8 years or so since I've coded WPF, so the memory is failing...
Fortunately, WPF is easy and there is plenty of help to google. Below code dynamically adds a button to a stack panel and the scrollbar gets added when there are more than 8 button items.
Note: I didn't dynamically add button handlers - there are several approaches to this. In a real app, you'll want to be able to tell which button click on the handler (even though you can use the same handler for all the buttons).
Code:
<Window x:Class="WpfApp1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApp1"
mc:Ignorable="d"
Title="MainWindow" Width ="275" Height="275">
<Grid x:Name="CategoryGrid" Width="250px" >
<Grid.RowDefinitions>
<RowDefinition Height="200"/>
<RowDefinition Height="35"/>
</Grid.RowDefinitions>
<Border BorderThickness="1" BorderBrush="Black">
<ScrollViewer Padding="20" Grid.Row="0" Height="200" VerticalScrollBarVisibility="Auto">
<StackPanel x:Name="CategoryStackPanel" Orientation="Vertical">
</StackPanel>
</ScrollViewer>
</Border>
<Button Grid.Row="1" Height="20" Width="100" Click="Button_Click">Add Button</Button>
</Grid>
</Window>
C#
Code:
namespace WpfApp1
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
CategoryStackPanel.Children.Add(new Button() { Content = $"Button: {++ButtonCount}" });
}
private int ButtonCount { get; set; }
}
}
I tried to use yours but the window of the box is too small how to make it wider ?
Re: How can I use scrollviewer to make it resizable when created button get off scree
Title="MainWindow" Width ="275" Height="275">
