Click here to Skip to main content
15,883,745 members
Please Sign up or sign in to vote.
1.00/5 (2 votes)
See more:
Step:I put a WrapPanel into the ScrollViewer. There is a button 1 in the window. Click button 1 and add a Button to the WrapPanel. When the number of Buttons in the WrapPanel exceeds the boundary of the WrapPanel, a vertical scroll bar will appear.

My question:I encountered a problem with a vertical scroll bar: when the vertical scroll bar appeared, the WrapPanel (or ScrollViewer?) changed to increase the width of a scroll bar (equivalent to a scroll bar outside). This problem will Causes the layout of other nearby controls to change. How can I fix it?

Window XAML:
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Border x:Name="Boder1" BorderThickness="1" BorderBrush="Black" Margin="0,0,368,0">
            <ScrollViewer x:Name="scrList" VerticalScrollBarVisibility="Auto" Margin="0,0,-2,-2">
                <WrapPanel x:Name="wplContent" Width="{Binding Width, ElementName=scrList, Mode=OneWay}">
                    <Button x:Name="CreateButton" Content="Button" Height="50" Width="50" Click="CreateButton_Click"/>

                </WrapPanel>
            </ScrollViewer>
        </Border>
        <Label Content="-Ranging" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="397,0,0,0"/>


    </Grid>
</Window>

CS:
private void CreateButton_Click(object sender, RoutedEventArgs e)
       {
           Button CButton = new Button();
           CButton.Width = 50;
           CButton.Height = 50;
           CButton.Content = "Button";
           wplContent.Children.Add(CButton);
       }

Click CreateButton under 65. When the number of button rows exceeds WrapPanel, you will find that the button moves to the left due to the appearance of the scroll bar. This is my problem.
Picture1:
https://i.loli.net/2021/09/10/YbZFWnst2V4ofGM.png[^]
Picture2:
https://i.loli.net/2021/09/10/DyxTAsaXVUCr19c.png[^]

What I have tried:

I found an example:
Give a WPF Grid the width of a ScrollViewer minus the scrollbar - Stack Overflow[^]
But it has nothing to do with my problem.
Posted
Updated 10-Sep-21 4:22am
v4
Comments
Richard Deeming 9-Sep-21 4:05am    
There's a secret error somewhere in your secret code. You should fix that.

Seriously, how do you expect anyone to help you fix your code when we can't see your code, and all we have by way of example is a link to a question that is "nothing to do with" your problem?

Click the green "Improve question" link and update your question to include the relevant parts of your code, and a clear description of the problem.
tianlong wang 9-Sep-21 6:58am    
OK Dear,Now How?
CHill60 9-Sep-21 7:02am    
"Click the green "Improve question" link" If it is not visible then hover your mouse over your question
tianlong wang 9-Sep-21 7:35am    
Step:I put a WrapPanel into the ScrollViewer. There is a button 1 in the window. Click button 1 and add a Button to the WrapPanel. When the number of Buttons in the WrapPanel exceeds the boundary of the WrapPanel, a vertical scroll bar will appear.

My question:I encountered a problem with a vertical scroll bar: when the vertical scroll bar appeared, the WrapPanel (or ScrollViewer?) changed to increase the width of a scroll bar (equivalent to a scroll bar outside). This problem will Causes the layout of other nearby controls to change. How can I fix it?
CHill60 9-Sep-21 7:56am    
Why have you just repeated your question here?
We cannot fix anything if we can't see your code. Follow the instructions to put your code into your post

1 solution

You need a right margin on the ScrollViewer "contents" if you don't want the contents obscured by the scroll bar. It's the width of a Repeater button; since that's what a scroller uses. Styling the width of a Repeater affects the scroller width. There's also ScrollViewer (inside) Padding.

So, Margin, Padding, or Repeater button style; or all of the above.
 
Share this answer
 
Comments
tianlong wang 9-Sep-21 22:32pm    
No, I want to block. This may be a bug in the design of Scrollviewer by Microsoft. My question is: For example, the width of the WrapPanel in the Scrollviewer is 200. When the Scrollbar does not appear, the width of the WrapPanel is 200, but when the Scrollbar appears, it is actually on the WrapPanel. Increase the width of a vertical scroll bar, then the WrapPanel width becomes 220 (I estimate the scroll bar width is 20), and now because of the additional scroll bar width, the WrapPanel in the Scrollviewer will move to the left, leading to other irrelevant controls on the left There was an error in the layout of.
[no name] 10-Sep-21 11:37am    
What does "I want to block" mean? I said to add a margin to the content; stop talking and listen.

WrapPanel Margin="0,0,16,0" ...
tianlong wang 10-Sep-21 20:05pm    
I have updated the question. You can understand my problem by comparing Picture 1 and Picture 2. The position of the buttons in the WrapPanel has changed because of the scroll bar in the WrapPanel.
tianlong wang 9-Sep-21 22:33pm    
I want the Scrollviewer to display scroll bars without changing the width automatically, so that the WrapPanel will not move to the left.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900