CODEWITHSUNDEEP
c#xamlwindows-8microsoft-metro
Saif Al Falah
Saif Al Falah

Reputation: 358

Auto Scrolling in Metro App using C# and XAML

I am making this Metro app which has a parent grid with 3 columns. In the col# 1, I have this login form. I want this to come at the center when the app loads. With the Sign Up and Recover passwords in col# 0 and col# 2 respectively. So I put the grid in a scrollviewer: `

<ScrollViewer HorizontalScrollBarVisibility="Auto"
              VerticalScrollBarVisibility="Disabled">

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="3*" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" /> <!--For Sign Up-->
        <ColumnDefinition Width="*" /> <!--For Sign In-->
        <ColumnDefinition Width="*" /> <!--To Recover Password-->
    </Grid.ColumnDefinitions>`

I don't want to set the width of the grid explicitly. Because then either I would have to optimize the size for very large resolutions or very small. What I want is the col# 1 in the middle with a little of col#0 and col#2 visible at the sides of col#1.

What should I set the width of grid to so that it looks consistent irrespective of the resolution? And how do I auto scroll and bring the col#1 in the middle?

Upvotes: 3

Views: 1424

Answers (1)

Jeremy Foster
Jeremy Foster

Reputation: 4763

I think you need to capture the screen width programmatically. I'm a HTML/JS dev, so I don't know what the property is in XAML/C#. Then you can set your grid size relative to that. Then if it changes, your grid will be bigger. As far as the scrolling goes, I think you're looking for something like what I wrote here (http://www.codefoster.com/post/2012/06/24/How-to-Make-Your-Grid-Pan-Automatically.aspx), but you'll have to translate between the JavaScript and C# because I wrote it in JS. Hope that helps.

Upvotes: 1

Related Questions