Scrooll inside item control

Eduardo Gomez 3,416 Reputation points
2021-09-19T18:09:13.94+00:00

Hello I have a WPF item, where I create text boxes dynamically, but I cannot do any scolling

    <Window.DataContext>
    <vm:MainWindowVM />
</Window.DataContext>

<WrapPanel>
    <Grid Margin="10">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="600" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="110" />
            <ColumnDefinition Width="200" />
        </Grid.ColumnDefinitions>

        <Label Content="Number of folders: " />

        <TextBox
            Grid.Column="1"
            VerticalAlignment="Center"
            PreviewTextInput="FolderNames_count"
            Text="{Binding Value, UpdateSourceTrigger=PropertyChanged}" />

        <Button
            Grid.Column="1"
            HorizontalAlignment="Right"
            VerticalAlignment="Center"
            BorderBrush="Transparent"
            Command="{Binding CreateCommand}"
            Content="Create"
            Focusable="False" />

        <ItemsControl
            Grid.Row="1"
            Grid.ColumnSpan="2"
            ItemsSource="{Binding TextBoxesCollection}" />
        <Button Grid.Row="2" Content="Create structure" />
    </Grid>
</WrapPanel>

</syncfusion:ChromelessWindow>

I tried to put y item template inside y Item control, but it did not wwork

XAML
XAML
A language based on Extensible Markup Language (XML) that enables developers to specify a hierarchy of objects with a set of properties and logic.
767 questions
{count} votes

1 answer

Sort by: Most helpful
  1. Hui Liu-MSFT 40,786 Reputation points Microsoft Vendor
    2021-09-21T02:03:44.213+00:00

    If you want to scroll the items of the ItemsControl horizontally and vertically, you could add a ScrollViewer outside the ItemsControl.
    When the height and width of the ScrollViewer is less than the height and width of the ItemsControl, you can scroll the ScrollViewer vertically and horizontally to view the complete items.

    <ScrollViewer  Grid.Row="1"  Width="300" Height="300" VerticalScrollBarVisibility="Visible" HorizontalScrollBarVisibility="Visible"  
                 Grid.ColumnSpan="2">  
                <ItemsControl Name="ic" Background="Pink"  
                 ItemsSource="{Binding TextBoxesCollection}" />  
    </ScrollViewer>  
    

    The code to create textbox:

     public ICommand CreateNewTextBoxCommand  
        {  
          get => new HelperCommand((state) =>  
          {  
            TextBox tb = new TextBox();  
            tb.Width = 400;  
            Num = DateTime.Now.ToLongTimeString();  
            tb.Text = Num;  
            TextBoxesCollection.Add(tb);  
            RaisePropertyChanged(nameof(Num));  
          });  
    }  
    

    The picture of the result:
    133803-2.gif


    If the response is helpful, please click "Accept Answer" and upvote it.
     Note: Please follow the steps in our [documentation][5] to enable e-mail notifications if you want to receive the related email notification for this thread. 

    [5]: https://learn.microsoft.com/en-us/answers/articles/67444/email-notifications.html