Move scrollviewer in SetupFlow pages

microsoft · Mar 15, 2024 · e2e4561 · e2e4561
1 parent 0babe67
commit e2e4561
Show file tree

Hide file tree

Showing 9 changed files with 350 additions and 345 deletions.
diff --git a/tools/SetupFlow/DevHome.SetupFlow/Controls/SetupShell.xaml b/tools/SetupFlow/DevHome.SetupFlow/Controls/SetupShell.xaml
@@ -20,7 +20,8 @@
             <RowDefinition Height="*"/>
         </Grid.RowDefinitions>
 
-        <StackPanel Spacing="6" Visibility="{x:Bind HeaderVisibility, Mode=OneWay}">
+        <StackPanel Spacing="6" Visibility="{x:Bind HeaderVisibility, Mode=OneWay}"
+                    MaxWidth="{ThemeResource MaxPageContentWidth}">
             <!-- Title -->
             <TextBlock
                 Style="{ThemeResource SubtitleTextBlockStyle}"
@@ -91,10 +92,17 @@
         </StackPanel>
 
         <!-- Content -->
-        <ContentControl Grid.Row="3" Grid.ColumnSpan="2"
-                        IsTabStop="False"
-                        HorizontalContentAlignment="Stretch"
-                        VerticalContentAlignment="Stretch"
-                        Content="{x:Bind SetupShellContent, Mode=OneWay}" />
+        <ScrollViewer Grid.Row="3" Grid.ColumnSpan="2">
+            <ContentControl IsTabStop="False"
+                            HorizontalContentAlignment="Stretch"
+                            VerticalContentAlignment="Stretch"
+                            Content="{x:Bind SetupShellContent, Mode=OneWay}" >
+                <ContentControl.Template>
+                    <ControlTemplate TargetType="ContentControl">
+                        <ContentPresenter Content="{TemplateBinding Content}" MaxWidth="{ThemeResource MaxPageContentWidth}" />
+                    </ControlTemplate>
+                </ContentControl.Template>
+            </ContentControl>
+        </ScrollViewer>
     </Grid>
 </UserControl>
diff --git a/tools/SetupFlow/DevHome.SetupFlow/Controls/SetupShell.xaml.cs b/tools/SetupFlow/DevHome.SetupFlow/Controls/SetupShell.xaml.cs
@@ -1,11 +1,9 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-using System;
 using DevHome.SetupFlow.Services;
 using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
-using Microsoft.UI.Xaml.Input;
 using Microsoft.UI.Xaml.Markup;
 
 namespace DevHome.SetupFlow.Controls;

diff --git a/tools/SetupFlow/DevHome.SetupFlow/Views/AppManagementView.xaml b/tools/SetupFlow/DevHome.SetupFlow/Views/AppManagementView.xaml
@@ -31,7 +31,7 @@
     </i:Interaction.Behaviors>
 
     <!-- Page split layout -->
-    <Grid ColumnSpacing="10">
+    <Grid ColumnSpacing="10" MaxWidth="{ThemeResource MaxPageContentWidth}" Margin="{ThemeResource ContentPageMargin}">
         <Grid.ColumnDefinitions>
             <ColumnDefinition Width="*"/>
             <ColumnDefinition Width="*" MaxWidth="318"/>

diff --git a/tools/SetupFlow/DevHome.SetupFlow/Views/LoadingView.xaml b/tools/SetupFlow/DevHome.SetupFlow/Views/LoadingView.xaml
@@ -52,7 +52,7 @@
     </UserControl.Resources>
 
     <!-- Page split layout -->
-    <Grid RowSpacing="10">
+    <Grid RowSpacing="10" MaxWidth="{ThemeResource MaxPageContentWidth}">
         <Grid.ColumnDefinitions>
             <ColumnDefinition Width="2*"/>
             <ColumnDefinition Width="*" />

diff --git a/tools/SetupFlow/DevHome.SetupFlow/Views/MainPageView.xaml b/tools/SetupFlow/DevHome.SetupFlow/Views/MainPageView.xaml
@@ -75,7 +75,7 @@
 
         <!-- Main content -->
         <controls:SetupShell Grid.Row="1" x:Uid="ms-resource:///DevHome.SetupFlow/Resources/MainPage">
-            <ScrollViewer VerticalScrollBarVisibility="Auto">
+            <Grid>
                 <StackPanel>
                     <commonviews:Banner
                         TextWidth="345"
@@ -217,7 +217,7 @@
                         </ctControls:SettingsCard>
                     </StackPanel>
                 </StackPanel>
-            </ScrollViewer>
+            </Grid>
         </controls:SetupShell>
     </Grid>
 </UserControl>
diff --git a/tools/SetupFlow/DevHome.SetupFlow/Views/RepoConfigView.xaml b/tools/SetupFlow/DevHome.SetupFlow/Views/RepoConfigView.xaml
@@ -32,7 +32,7 @@
         </ResourceDictionary>
     </UserControl.Resources>
 
-    <setupControls:SetupShell 
+    <setupControls:SetupShell
             Description="{x:Bind ViewModel.PageSubTitle, Mode=OneWay}"
             Orchestrator="{x:Bind ViewModel.Orchestrator, Mode=OneWay}"
             Foreground="{ThemeResource TextFillColorSecondary}">

diff --git a/tools/SetupFlow/DevHome.SetupFlow/Views/SetupFlowPage.xaml b/tools/SetupFlow/DevHome.SetupFlow/Views/SetupFlowPage.xaml
@@ -4,9 +4,7 @@
 <pg:ToolPage
     x:Class="DevHome.SetupFlow.Views.SetupFlowPage"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
-    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
     xmlns:converters="using:CommunityToolkit.WinUI.Converters"
     xmlns:pg="using:DevHome.Common"
     xmlns:behaviors="using:DevHome.Common.Behaviors"
@@ -15,14 +13,12 @@
     xmlns:views="using:DevHome.SetupFlow.Views"
     xmlns:controls="using:DevHome.SetupFlow.Controls"
     xmlns:i="using:Microsoft.Xaml.Interactivity"
-    xmlns:ic="using:Microsoft.Xaml.Interactions.Core"
-    behaviors:NavigationViewHeaderBehavior.HeaderMode="Never"
-    mc:Ignorable="d">
+    behaviors:NavigationViewHeaderBehavior.HeaderMode="Never">
     <Page.Resources>
         <converters:BoolToVisibilityConverter x:Key="NegatedBoolToVisibilityConverter" TrueValue="Collapsed" FalseValue="Visible" />
     </Page.Resources>
 
-    <Grid MaxWidth="{ThemeResource MaxPageContentWidth}" Margin="{ThemeResource ContentPageMargin}">
+    <Grid>
         <Grid.RowDefinitions>
             <RowDefinition Height="*" />
             <RowDefinition Height="auto" />
@@ -83,6 +79,7 @@
 
         <controls:SetupFlowNavigation
             Grid.Row="1"
+            MaxWidth="{ThemeResource MaxPageContentWidth}" Margin="{ThemeResource ContentPageMargin}"
             Visibility="{x:Bind ViewModel.Orchestrator.CurrentPageViewModel.IsNavigationBarVisible, Mode=OneWay}">
             <i:Interaction.Behaviors>
                 <setupFlowBehaviors:SetupFlowNavigationBehavior>

diff --git a/tools/SetupFlow/DevHome.SetupFlow/Views/SetupTargetView.xaml b/tools/SetupFlow/DevHome.SetupFlow/Views/SetupTargetView.xaml
@@ -231,8 +231,8 @@
             </DataTemplate>
         </ResourceDictionary>
     </UserControl.Resources>
-    
-    <ScrollViewer >
+
+    <ScrollViewer MaxWidth="{ThemeResource MaxPageContentWidth}">
         <StackPanel Spacing="10">
             <!--- Show the "Setup a Target header on the page. -->
             <setupControls:SetupShell