question

JerryM-2071 avatar image
0 Votes"
JerryM-2071 asked JerryM-2071 answered

ScrollViewer is not visible...

Hi,
I am trying ScrolViewer in WPF and .. it does not work. I see the ScrolViewer in design mode but it disappears when my app is running. Can someone help me why ?

Design Mode:

96858-designer.jpg


Running time:

96859-running.jpg


Here is XAML code:

 <Window x:Class="WpfApp.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:WpfApp"
         mc:Ignorable="d"
         Title="MainWindow" Height="480" Width="800" MaxWidth="800" MaxHeight="480">
     <Grid>
         <Grid.ColumnDefinitions>
             <ColumnDefinition Width="500" />
             <ColumnDefinition Width="300" MaxWidth="300"/>
         </Grid.ColumnDefinitions>
    
         <Grid.RowDefinitions>
             <RowDefinition Height="40" />
             <RowDefinition Height="440" />
         </Grid.RowDefinitions>
    
         <DockPanel Grid.Column="0" Grid.Row="0">
             <Menu DockPanel.Dock="Top">
                 <MenuItem Header="_File" FontSize="24" FontFamily="Arial">
                     <MenuItem Header="_New" >
                         <MenuItem.Icon>
                             <Image Source="c:\1\WPF-01\Button-Previous-icon.png" />
                         </MenuItem.Icon>
                     </MenuItem>
                     <MenuItem Header="_Open" />
                     <MenuItem Header="_Save" />
                     <Separator />
                     <MenuItem Header="_Exit" />
                 </MenuItem>
             </Menu>
         </DockPanel>
    
         <Button  Grid.Column="0" Grid.Row="1" x:Name="btn001" Content="Hello" Width="200" Height="200" Click="btn001_Click" />
    
         <TabControl Grid.Column="1" Grid.Row="1"
                     Width="300" 
                     MaxWidth="300" 
                     Height="440" 
                     VerticalAlignment="Top">
             <TabItem Header="TabItem" ClipToBounds="True" >
                 <Grid Background="#FFE5E5E5" 
                       Margin="-4,-4,0,0" 
                       Height="Auto"
                       VerticalAlignment="Stretch"
                       HorizontalAlignment="Stretch"
                       >
    
                     <Grid.ColumnDefinitions>
                         <ColumnDefinition Width="300" />
                     </Grid.ColumnDefinitions>
                     <Grid.RowDefinitions>
                         <RowDefinition Height="400" />
                     </Grid.RowDefinitions>
    
                     <ScrollViewer Grid.Column="0" Grid.Row="0"
                                   HorizontalAlignment="Stretch"
                                   VerticalAlignment="Stretch"
                                   VerticalScrollBarVisibility="Visible" 
                                   HorizontalScrollBarVisibility="Visible" 
                                   Margin="0,0,0,0"
                                   Padding="0,0" 
                                   >
                         <StackPanel Name="stackPanel1" 
                                     Width="310" 
                                     Height="800"
                                     MaxWidth="310">
                             <GroupBox HorizontalAlignment="Left" 
                                       VerticalAlignment="Top"
                                       Header="Text" 
                                       Margin="4,4,0,0" 
                                       Padding="0,0"
                                       Height="401" 
                                       Width="180" 
                                       Background="White" >
                             </GroupBox>
                         </StackPanel>
    
                     </ScrollViewer>
    
                 </Grid>
             </TabItem>
             <TabItem Header="TabItem">
                 <Grid Background="#FFE5E5E5"/>
             </TabItem>
         </TabControl>
    
    
     </Grid>
 </Window>




dotnet-wpf-xaml
designer.jpg (35.3 KiB)
running.jpg (31.3 KiB)
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

JerryM-2071 avatar image
0 Votes"
JerryM-2071 answered


Wou I finally found the answer. Instead of this:

Title="MainWindow" Width="800" Height="500" MaxWidth="800" MaxHeight="500">

I have to use this:

Title="MainWindow" SizeToContent="WidthAndHeight" WindowStyle="ToolWindow" WindowStartupLocation="CenterScreen">

and the most important thing is: SizeToContent="WidthAndHeight" ...

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

DaisyTian-1203 avatar image
0 Votes"
DaisyTian-1203 answered DaisyTian-1203 edited

You do not set ScrollViewer length and width, and the StackPanel's length and width are larger than the TabControl's width and length, so the ScrollViewer is not visible. If you make the window larger, it will make your ScrollViewer work.
You can set Margin="0,0,18,50" to ScrollViewer to make VerticalScrollBar and HorizontalScrollBar Visible like:

   <ScrollViewer Grid.Column="0" Grid.Row="0" 
                                    HorizontalAlignment="Stretch"
                                    VerticalAlignment="Stretch"
                                    VerticalScrollBarVisibility="Visible" 
                                    HorizontalScrollBarVisibility="Visible" 
                                    Margin="0,0,18,50"
                                    Padding="0,0" 
                                    >

By the way, if I misunderstand your question , and please point out.


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

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.