Noble-Surfer
Noble-Surfer

Reputation: 3172

XAML- how to set the size of a ScrollViewer dynamically?

I am displaying a <ScrollViewer> in my application window using XAML. At the moment, I am specifying the size of the <ScrollViewer> statically (i.e. giving it a set value, which cannot be changed while the application is running):

<Window>
    <Grid>
        <TabControl>
            <TabItem>
                <StackPanel>
                    <Grid>
                        <ScrollViewer x:Name="scroller" HorizontalAlignment="Right" VerticalScrollBarVisibility="Auto" Margin="39,10,0,0" VerticalAlignment="Top" Height="244" Width="450">
                            <TextBox x:Name="infoPane" TextWrapping="Wrap" Text="nothing" IsReadOnly="True" />
                        </ScrollViewer>
                    </Grid>
                </StackPanel>
            </TabItem>
        </TabControl>
    </Grid>
</Window>

What I want to do, is dynamically set the width of the <ScrollViewer> to half the width of the application window, so that it will always cover half of the displayed content.

The user can re-size the application window by dragging one of the corners or edges of the window, so the area of the display that the <ScrollViewer> takes up should automatically always be half of the width of the application window, whatever that is.

Is there a way that I can dynamically set the value of the <ScrollViewer> Width property?

Upvotes: 2

Views: 2661

Answers (2)

WPMed
WPMed

Reputation: 1414

To get the width and height of current window call Window.Current.Bounds.Width / .Height . Just divide by two to get what you want. Setting the value dynamically is also easy: scroller.Width = value. You could consider creating a Grid with 2 Columns both with Width="*" and place the ScrollViewer in one of them to get the exact same effect you want.

EDIT

Here's what I meant in the second part of my answer:

<Window>
<Grid>
    <TabControl>
        <TabItem>
            <StackPanel>
                <Grid>
                     <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />

                     </Grid.ColumnDefinitions>
                    <ScrollViewer x:Name="scroller" Grid.Column="0" HorizontalAlignment="Stretch" VerticalScrollBarVisibility="Auto" Margin="39,10,0,0" VerticalAlignment="Top" Height="244" Width="{Binding ActualWidth,RelativeSource={RelativeSource 
                           Mode=FindAncestor, AncestorType=Grid}}">
                        <TextBox x:Name="infoPane" TextWrapping="Wrap" Text="nothing" IsReadOnly="True" />
                    </ScrollViewer>
                </Grid>
            </StackPanel>
        </TabItem>
    </TabControl>
</Grid>
</Window>

Upvotes: 2

Esteban Chamard
Esteban Chamard

Reputation: 100

Oh my bad, I misunderstood : Can you give your whole XAML ?

Dynamic way is : width="x*" Where x is a number. But if you give the whole XAML I could make an example.

Edit :

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*" />
        <ColumnDefinition Width="1*" />
    </Grid.ColumnDefinitions>

    <ScrollViewer x:Name="scroller" VerticalScrollBarVisibility="Auto">
        <TextBox x:Name="infoPane" TextWrapping="Wrap" Text="nothing" IsReadOnly="True" />
    </ScrollViewer>

</Grid>

Upvotes: 0

Related Questions