WPF C# DockPanel alignment , content got cut off

Question

I have a few information that i want to display inside the DockPanel but , it goes out of line in the DockPanel and some text got cut off like this :

i populate them in code behind , how do i set the dockpanel alignment such that the whole content can be placed inside it without being cut-off .

Heres the xaml code :

    <Grid Background="#FF5EC136">

    <DockPanel Height="894" HorizontalAlignment="Stretch" Margin="365,135,0,0" Name="dockPanel1" VerticalAlignment="Top" Width="1174" />
</Grid>

i don't know if my xaml.cs will be useful , so i just post it here most of the codes are unrelated tho :

      private void PopulateQuestion(int activityID, int taskID)
    {
      IList<Model.questionhint> lstQuestionHints = qh.GetRecords(taskID, activityID);

        StackPanel sp = new StackPanel();

        foreach (Model.questionhint qhm in lstQuestionHints)
        {
            StackPanel sp1 = new StackPanel() { Orientation = Orientation.Horizontal };
            TextBlock tb = new TextBlock();
            tb.Text = qhm.QuestionContent;
            tb.FontWeight = FontWeights.Bold;
            tb.FontSize = 24;
            sp1.Children.Add(tb);

            TextBox tbox = new TextBox();
            tbox.Width = 100;
            tbox.FontSize = 24;
            tbox.FontWeight = FontWeights.Bold;

            if (qhm.Option1.Trim().Length > 0 &&
               qhm.Option2.Trim().Length > 0)
            {

            sp1.Children.Add(tbox);

            }
           Label btn1 = new Label();
            Label btn2 = new Label();
            if (qhm.Option1.Trim().Length > 0)
            {

                btn1.Content = qhm.Option1;
                btn1.Width = 110;
                btn1.FontSize = 24;
                btn1.FontWeight = FontWeights.Bold;
                btn1.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B"); 
                sp1.Children.Add(btn1);                                     
                btn1.MouseLeftButtonDown += (source, e) =>
                {
                    btn2.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B"); 
                    btn1.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFF0FA08"); 
                    tbox.Text = btn1.Content.ToString();
                };

            }
            if (qhm.Option2.Trim().Length > 0)
            {

                btn2.Content = qhm.Option2;
                btn2.Width = 110;
                btn2.FontSize = 24;
                btn2.FontWeight = FontWeights.Bold;
                btn2.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B");
                sp1.Children.Add(btn2);
                btn2.MouseLeftButtonDown += (source, e) =>
                {
                    btn1.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFE22B2B"); 
                    btn2.Foreground = (SolidColorBrush)new BrushConverter().ConvertFromString("#FFF0FA08"); 
                    tbox.Text =btn2.Content.ToString();
                };
            }

            sp.Children.Add(sp1);
        }
        dockPanel1.Children.Add(sp);

Answer 1

Use WrapPanel instead of StackPanel. Replace following line in your code

StackPanel sp1 = new StackPanel() { Orientation = Orientation.Horizontal };

with

WrapPanel wp = new WrapPanel();