WPF. How to dynamically add new pages to grid?-CodePudding

I am creating app in wpf that display some places in the world (descriptions, photos) and there are also opinions, that user can write. To display them I created new Grid, where user can add up to 5 opinions (if more the texts overlap). Because of this problem I wanted to dynamically add new pages to Grid, e.g. if user added 6th opinion, new grid page created and new button appers on the bottom of Grid with page number (navigation). But I have no clue how to write it.

Grid used to display opinions:

        <Grid Grid.Column="2" Grid.ColumnSpan="3"
              Grid.Row="0" Grid.RowSpan="3" x:Name="newGrid" Margin="0,50,0,0"
              >
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            
        </Grid>

Function used to add new opinions:

        private void btnConfirm_Click(object sender, RoutedEventArgs e)
        {
            txtName.Visibility = Visibility.Hidden;
            tbName.Visibility = Visibility.Hidden;
            txtOpinion.Visibility = Visibility.Hidden;
            tbOpinion.Visibility = Visibility.Hidden;
            btnConfirm.Visibility = Visibility.Hidden;
            
            var name = tbName.Text;
            var opinion = tbOpinion.Text;

            if(name != "" && opinion != "" && name != " " && opinion != " ")
            {
                TextBlock tb = new TextBlock();
                tb.Text = name   ": "   opinion;
                tb.HorizontalAlignment = HorizontalAlignment.Left;
                tb.VerticalAlignment = VerticalAlignment.Bottom;
                tb.FontSize = 30;
                tb.Foreground = Brushes.White;
                tb.Margin = new Thickness(50, 0, 0, 0);
                tb.TextWrapping = TextWrapping.Wrap;
                tb.TextAlignment = TextAlignment.Justify;

                newGrid.Children.Add(tb);
                Grid.SetRow(tb, klik);
                Grid.SetColumnSpan(tb, 3);
                klik  ; //opinion counter and also number of row
            }
            else
            {
                MessageBox.Show("Fields cannot by empty!","Error",MessageBoxButton.OK,MessageBoxImage.Error);
            }

I suppose variable klik must be used, because that variable is responsible for counting opinions. So it would be:

if(klik>5)
{
//add new grid page - but I have no clue how to do this
}

CodePudding user response：

First off I want to preface this by saying there are many better ways to design your application (using MVVM design patterns, Styles, DataTemplates, etc.). Learning those skills will benefit you as a developer in the long run. Having said that, I'll answer this based on your request.

Because you are adding new rows that do not have a home yet on your Grid, you'll first need to add a new placeholder for the row by adding a new RowDefinition.

newGrid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) });

Then perform your code the same as you did before. So it should look something like this:

if(klik>5)
{
    newGrid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) });
}

if(name != "" && opinion != "" && name != " " && opinion != " ")
{
    TextBlock tb = new TextBlock();
    tb.Text = name   ": "   opinion;
    tb.HorizontalAlignment = HorizontalAlignment.Left;
    // ... etc etc etc
}