From fe89a9dfc82357ae79bddf0dada4658ad05e15d3 Mon Sep 17 00:00:00 2001
From: NaBian <836904362@qq.com>
Date: Sat, 19 Mar 2022 23:08:59 +0800
Subject: [PATCH] chore: optimized element layout of extend controls demo

---
 .../HandyControl_Net_40/Themes/Theme.xaml     |   1 +
 .../HandyControlDemo_Code.csproj              |   3 +
 .../Resources/Themes/Styles/Style.xaml        |   3 +-
 .../UserControl/Controls/BadgeDemoCtl.xaml    |  14 +-
 .../Controls/ButtonGroupDemoCtl.xaml          | 126 +++++++++---------
 .../UserControl/Controls/CardDemoCtl.xaml     |   2 +-
 .../UserControl/Controls/CarouselDemoCtl.xaml |   2 +-
 .../Controls/ChatBubbleDemoCtl.xaml           |  26 ++--
 .../Controls/CheckComboBoxDemoCtl.xaml        |   4 +-
 .../UserControl/Controls/ClockDemoCtl.xaml    |  10 +-
 .../UserControl/Controls/ComboBoxDemoCtl.xaml |   4 +-
 .../Controls/CompareSliderDemoCtl.xaml        |   2 +-
 .../Controls/CoverFlowDemoCtl.xaml            |   4 +-
 .../Controls/CoverViewDemoCtl.xaml            |  30 +++--
 .../Controls/DatePickerDemoCtl.xaml           |   4 +-
 .../Controls/DateTimePickerDemoCtl.xaml       |   4 +-
 .../UserControl/Controls/DividerDemoCtl.xaml  |  66 ++++-----
 .../Controls/ElementGroupDemoCtl.xaml         |   2 +-
 .../Controls/FlexPanelDemoCtl.xaml            |   4 +-
 .../Controls/FlipClockDemoCtl.xaml            |   4 +-
 .../UserControl/Controls/GotoTopDemoCtl.xaml  |   2 +-
 .../UserControl/Controls/GravatarDemoCtl.xaml |  40 +++---
 .../UserControl/Controls/GridDemoCtl.xaml     |   4 +-
 .../Controls/ImageBlockDemoCtl.xaml           |  28 ++--
 .../Controls/ImageBrowserDemoCtl.xaml         |   2 +-
 .../Controls/ImageSelectorDemoCtl.xaml        |  18 +--
 .../Controls/MagnifierDemoCtl.xaml            |  18 +--
 .../Controls/NumericUpDownDemoCtl.xaml        | 110 +++++++--------
 .../Controls/OutlineTextDemoCtl.xaml          |  20 +--
 .../Controls/PaginationDemoCtl.xaml           |   2 +-
 .../Controls/PasswordBoxDemoCtl.xaml          |  42 +++---
 .../UserControl/Controls/PoptipDemoCtl.xaml   |  26 ++--
 .../Controls/ProgressButtonDemoCtl.xaml       |  38 +++---
 .../Controls/RangeSliderDemoCtl.xaml          |  30 +++--
 .../Controls/RelativePanelDemoCtl.xaml        | 108 +++++++--------
 .../Controls/RunningBlockDemoCtl.xaml         |  54 ++++----
 .../Controls/ScrollViewerDemoCtl.xaml         |   2 +-
 .../Controls/SearchBarDemoCtl.xaml            | 102 +++++++-------
 .../Controls/TabControlDemoCtl.xaml           |  24 ++--
 .../UserControl/Controls/TagDemoCtl.xaml      |  56 ++++----
 .../UserControl/Controls/TextBoxDemoCtl.xaml  |  70 +++++-----
 .../Controls/TimePickerDemoCtl.xaml           |   4 +-
 .../TransitioningContentControlDemoCtl.xaml   |  86 ++++++------
 .../Controls/UniformSpacingPanelDemoCtl.xaml  |  60 +++++----
 .../Controls/WaterfallPanelDemoCtl.xaml       |   6 +-
 .../UserControl/Controls/WindowDemoCtl.xaml   |  24 ++--
 .../Styles/NativeScrollViewerDemoCtl.xaml     |   2 +-
 .../Styles/NativeWindowDemoCtl.xaml           |   4 +-
 .../UserControl/Styles/TextBlockDemoCtl.xaml  |  61 +++------
 .../UserControl/Tools/EffectsDemoCtl.xaml     | 114 ++++++++--------
 .../Styles/Base/RadioButtonBaseStyle.xaml     |   1 +
 .../HandyControl_Shared/Themes/Theme.xaml     |   1 +
 52 files changed, 752 insertions(+), 722 deletions(-)

diff --git a/src/Net_40/HandyControl_Net_40/Themes/Theme.xaml b/src/Net_40/HandyControl_Net_40/Themes/Theme.xaml
index 5ffc7a19..e6e99ae8 100644
--- a/src/Net_40/HandyControl_Net_40/Themes/Theme.xaml
+++ b/src/Net_40/HandyControl_Net_40/Themes/Theme.xaml
@@ -3015,6 +3015,7 @@
 	<Style x:Key="RadioButtonIconBaseStyle" BasedOn="{StaticResource ButtonBaseBaseStyle}" TargetType="RadioButton">
 		<Setter Property="BorderThickness" Value="1" />
 		<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisualRadius0}" />
+		<Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}" />
 		<Setter Property="Background" Value="{DynamicResource RegionBrush}" />
 		<Setter Property="hc:BorderElement.CornerRadius" Value="0" />
 		<Setter Property="hc:VisualElement.HighlightBrush" Value="{DynamicResource PrimaryBrush}" />
diff --git a/src/Shared/HandyControlDemo_Code/HandyControlDemo_Code.csproj b/src/Shared/HandyControlDemo_Code/HandyControlDemo_Code.csproj
index d987392a..ba9826f5 100644
--- a/src/Shared/HandyControlDemo_Code/HandyControlDemo_Code.csproj
+++ b/src/Shared/HandyControlDemo_Code/HandyControlDemo_Code.csproj
@@ -854,6 +854,9 @@
     <Resource Include="..\..\Shared\HandyControlDemo_Shared\ViewModel\Basic\InteractiveDialogViewModel.cs">
       <Link>ViewModel\InteractiveDialogViewModel.cs</Link>
     </Resource>
+    <Resource Include="..\..\Shared\HandyControlDemo_Shared\ViewModel\Common\InputElementDemoViewModel.cs">
+      <Link>ViewModel\InputElementDemoViewModel.cs</Link>
+    </Resource>
     <Resource Include="..\..\Shared\HandyControlDemo_Shared\ViewModel\Controls\AutoCompleteTextBoxDemoViewModel.cs">
       <Link>ViewModel\AutoCompleteTextBoxDemoViewModel.cs</Link>
     </Resource>
diff --git a/src/Shared/HandyControlDemo_Shared/Resources/Themes/Styles/Style.xaml b/src/Shared/HandyControlDemo_Shared/Resources/Themes/Styles/Style.xaml
index 924112f4..e6cf4862 100644
--- a/src/Shared/HandyControlDemo_Shared/Resources/Themes/Styles/Style.xaml
+++ b/src/Shared/HandyControlDemo_Shared/Resources/Themes/Styles/Style.xaml
@@ -81,6 +81,7 @@
         <Setter Property="hc:BorderElement.CornerRadius" Value="4"/>
         <Setter Property="Background" Value="Transparent"/>
         <Setter Property="ItemContainerStyle" Value="{StaticResource ListBoxItemTransparent}"/>
+        <Setter Property="hc:ScrollViewer.IsInertiaEnabled" Value="True"/>
     </Style>
 
     <ItemsPanelTemplate x:Key="FluidMoveBehaviorWrapPanelItemsPanelTemplate">
@@ -176,7 +177,7 @@
                         </Style>
                     </ControlTemplate.Resources>
                     <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
-                        <ScrollViewer Name="PART_ScrollViewer" Padding="{TemplateBinding Padding}" HorizontalContentAlignment="Left" VerticalContentAlignment="Top" CanContentScroll="True" Content="{Binding TextArea,RelativeSource={RelativeSource TemplatedParent}}" Focusable="False" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" />
+                        <hc:ScrollViewer IsInertiaEnabled="True" Name="PART_ScrollViewer" Padding="{TemplateBinding Padding}" HorizontalContentAlignment="Left" VerticalContentAlignment="Top" CanContentScroll="True" Content="{Binding TextArea,RelativeSource={RelativeSource TemplatedParent}}" Focusable="False" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" />
                     </Border>
                     <ControlTemplate.Triggers>
                         <Trigger Property="WordWrap" Value="True">
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/BadgeDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/BadgeDemoCtl.xaml
index 8d363fcb..806ae926 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/BadgeDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/BadgeDemoCtl.xaml
@@ -7,25 +7,25 @@
              Background="{DynamicResource RegionBrush}"
              DataContext="{Binding BadgeDemo, Source={StaticResource Locator}}">
     <hc:TransitioningContentControl>
-        <StackPanel Margin="32" Orientation="Horizontal">
+        <hc:UniformSpacingPanel Margin="32" Spacing="32" ChildWrapping="Wrap" VerticalAlignment="Center" HorizontalAlignment="Center">
             <hc:Badge Text="New" BadgeMargin="0,-14,-20,0" Height="30">
                 <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Comment}}"/>
             </hc:Badge>
-            <hc:Badge Text="New" BadgeMargin="0,-14,-20,0" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
+            <hc:Badge Text="New" BadgeMargin="0,-14,-20,0" Height="30" Style="{StaticResource BadgeDanger}">
                 <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Comment}}"/>
             </hc:Badge>
-            <hc:Badge Value="{Binding Count}" BadgeMargin="0,-14,-10,0" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgePrimary}">
+            <hc:Badge Value="{Binding Count}" BadgeMargin="0,-14,-10,0" Height="30" Style="{StaticResource BadgePrimary}">
                 <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Click2Count}}" Command="{Binding CountCmd}"/>
             </hc:Badge>
-            <hc:Badge Value="100" BadgeMargin="0,-14,-20,0" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
+            <hc:Badge Value="100" BadgeMargin="0,-14,-20,0" Height="30" Style="{StaticResource BadgeDanger}">
                 <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Comment}}"/>
             </hc:Badge>
-            <hc:Badge Status="Dot" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
+            <hc:Badge Status="Dot" Height="30" Style="{StaticResource BadgeDanger}">
                 <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Reply}}"/>
             </hc:Badge>
-            <hc:Badge Status="Processing" Height="30" Margin="32,0,0,0" Style="{StaticResource BadgeDanger}">
+            <hc:Badge Status="Processing" Height="30" Style="{StaticResource BadgeDanger}">
                 <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Reply}}" />
             </hc:Badge>
-        </StackPanel>
+        </hc:UniformSpacingPanel>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ButtonGroupDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ButtonGroupDemoCtl.xaml
index d5ff5fc5..56a1dfe7 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ButtonGroupDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ButtonGroupDemoCtl.xaml
@@ -6,67 +6,69 @@
              xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension">
     <hc:TransitioningContentControl>
-        <WrapPanel Margin="16" VerticalAlignment="Center">
-            <StackPanel Margin="16">
-                <hc:ButtonGroup>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                </hc:ButtonGroup>
-                <hc:ButtonGroup Margin="0,32,0,0">
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                </hc:ButtonGroup>
-                <hc:ButtonGroup Margin="0,32,0,0" Style="{StaticResource ButtonGroupSolid}">
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                </hc:ButtonGroup>
-                <hc:ButtonGroup Margin="0,32,0,0">
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
-                </hc:ButtonGroup>
-            </StackPanel>
-            <StackPanel Margin="16" Orientation="Horizontal">
-                <hc:ButtonGroup Orientation="Vertical">
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                </hc:ButtonGroup>
-                <hc:ButtonGroup Margin="32,0,0,0" Orientation="Vertical">
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                </hc:ButtonGroup>
-                <hc:ButtonGroup Margin="32,0,0,0" Style="{StaticResource ButtonGroupSolid}" Orientation="Vertical">
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                </hc:ButtonGroup>
-                <hc:ButtonGroup Margin="32,0,0,0" Orientation="Vertical">
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
-                    <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
-                    <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
-                </hc:ButtonGroup>
-            </StackPanel>
-        </WrapPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" Spacing="32" ChildWrapping="Wrap" VerticalAlignment="Center">
+                <hc:UniformSpacingPanel Spacing="32" Orientation="Vertical">
+                    <hc:ButtonGroup>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                    </hc:ButtonGroup>
+                    <hc:ButtonGroup>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                    </hc:ButtonGroup>
+                    <hc:ButtonGroup Style="{StaticResource ButtonGroupSolid}">
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                    </hc:ButtonGroup>
+                    <hc:ButtonGroup>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
+                    </hc:ButtonGroup>
+                </hc:UniformSpacingPanel>
+                <hc:UniformSpacingPanel Spacing="32" ChildWrapping="Wrap">
+                    <hc:ButtonGroup Orientation="Vertical">
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                    </hc:ButtonGroup>
+                    <hc:ButtonGroup Orientation="Vertical">
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                    </hc:ButtonGroup>
+                    <hc:ButtonGroup Style="{StaticResource ButtonGroupSolid}" Orientation="Vertical">
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                    </hc:ButtonGroup>
+                    <hc:ButtonGroup Orientation="Vertical">
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}" IsChecked="True"/>
+                        <RadioButton Content="{ex:Lang Key={x:Static langs:LangKeys.RadioButton}}"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
+                        <ToggleButton Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}" IsChecked="True"/>
+                    </hc:ButtonGroup>
+                </hc:UniformSpacingPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CardDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CardDemoCtl.xaml
index d446a17f..9a966eb3 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CardDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CardDemoCtl.xaml
@@ -6,7 +6,7 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              xmlns:data="clr-namespace:HandyControlDemo.Data">
     <hc:TransitioningContentControl>
-        <ListBox Margin="32" BorderThickness="0" Style="{StaticResource WrapPanelHorizontalListBox}" ItemsPanel="{StaticResource FluidMoveBehaviorWrapPanelItemsPanelTemplate}" ItemsSource="{Binding DataList}">
+        <ListBox Margin="32" hc:ScrollViewer.IsInertiaEnabled="True" BorderThickness="0" Style="{StaticResource WrapPanelHorizontalListBox}" ItemsPanel="{StaticResource FluidMoveBehaviorWrapPanelItemsPanelTemplate}" ItemsSource="{Binding DataList}">
             <ListBox.ItemTemplate>
                 <DataTemplate DataType="data:CardModel">
                     <hc:Card MaxWidth="240" BorderThickness="0" Effect="{StaticResource EffectShadow2}" Margin="8" Footer="{Binding Footer}">
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CarouselDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CarouselDemoCtl.xaml
index 889109ad..f9ccfd6f 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CarouselDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CarouselDemoCtl.xaml
@@ -4,7 +4,7 @@
              Background="{DynamicResource RegionBrush}"
              xmlns:hc="https://handyorg.github.io/handycontrol">
     <hc:TransitioningContentControl>
-        <hc:Carousel Margin="32" IsCenter="True" AutoRun="True" Width="600" Height="330" VerticalAlignment="Center">
+        <hc:Carousel Margin="32" IsCenter="True" AutoRun="True" MaxWidth="600" Height="330" VerticalAlignment="Center">
             <Image Width="600" Stretch="UniformToFill" Source="/HandyControlDemo;component/Resources/Img/1.jpg"/>
             <Image Width="300" Stretch="UniformToFill" Source="/HandyControlDemo;component/Resources/Img/2.jpg"/>
             <hc:SimplePanel Width="600">
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ChatBubbleDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ChatBubbleDemoCtl.xaml
index b7e9da26..0e58a4f0 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ChatBubbleDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ChatBubbleDemoCtl.xaml
@@ -5,17 +5,19 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <StackPanel Orientation="Horizontal" Margin="32">
-            <userControl:ChatBox>
-                <userControl:ChatBox.Background>
-                    <ImageBrush ImageSource="/HandyControlDemo;component/Resources/Img/Chat/chat_back1.jpg" Stretch="Uniform"/>
-                </userControl:ChatBox.Background>
-            </userControl:ChatBox>
-            <userControl:ChatBox Margin="32,0,0,0">
-                <userControl:ChatBox.Background>
-                    <ImageBrush ImageSource="/HandyControlDemo;component/Resources/Img/Chat/chat_back2.jpg" Stretch="Uniform"/>
-                </userControl:ChatBox.Background>
-            </userControl:ChatBox>
-        </StackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Spacing="32" ChildWrapping="Wrap" Margin="32">
+                <userControl:ChatBox>
+                    <userControl:ChatBox.Background>
+                        <ImageBrush ImageSource="/HandyControlDemo;component/Resources/Img/Chat/chat_back1.jpg" Stretch="Uniform"/>
+                    </userControl:ChatBox.Background>
+                </userControl:ChatBox>
+                <userControl:ChatBox>
+                    <userControl:ChatBox.Background>
+                        <ImageBrush ImageSource="/HandyControlDemo;component/Resources/Img/Chat/chat_back2.jpg" Stretch="Uniform"/>
+                    </userControl:ChatBox.Background>
+                </userControl:ChatBox>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CheckComboBoxDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CheckComboBoxDemoCtl.xaml
index cee0bb0c..79e3ea2e 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CheckComboBoxDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CheckComboBoxDemoCtl.xaml
@@ -7,7 +7,7 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <ScrollViewer>
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
                 <StackPanel>
                     <hc:CheckComboBox ShowClearButton="True" MaxWidth="380" ItemsSource="{Binding DataList}" ShowSelectAllButton="True"/>
@@ -50,6 +50,6 @@
                     <hc:CheckComboBox MaxWidth="380" ItemsSource="{Binding DataList}" ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource CheckComboBoxPlus.Small}" hc:InfoElement.Necessary="True" Margin="0,16,0,0"/>
                 </StackPanel>
             </hc:UniformSpacingPanel>
-        </ScrollViewer>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ClockDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ClockDemoCtl.xaml
index bc1a0bfb..45f5cb92 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ClockDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ClockDemoCtl.xaml
@@ -4,9 +4,11 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <StackPanel Orientation="Horizontal" Margin="32">
-            <hc:Clock/>
-            <hc:ListClock Margin="16,0,0,0"/>
-        </StackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Spacing="16" ChildWrapping="Wrap" Margin="32">
+                <hc:Clock/>
+                <hc:ListClock/>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ComboBoxDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ComboBoxDemoCtl.xaml
index ab9fa393..2b6d7aae 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ComboBoxDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ComboBoxDemoCtl.xaml
@@ -7,7 +7,7 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <ScrollViewer>
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
                 <StackPanel>
                     <hc:ComboBox ShowClearButton="True" ItemsSource="{Binding DataList}" SelectedIndex="0"/>
@@ -40,6 +40,6 @@
                     <hc:ComboBox AutoComplete="True" ShowClearButton="True" ItemsSource="{Binding DataList}" IsEditable="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0" Style="{StaticResource ComboBoxPlus.Small}"/>
                 </StackPanel>
             </hc:UniformSpacingPanel>
-        </ScrollViewer>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CompareSliderDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CompareSliderDemoCtl.xaml
index c77e8e3c..50168652 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CompareSliderDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CompareSliderDemoCtl.xaml
@@ -4,7 +4,7 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:ScrollViewer VerticalAlignment="Center">
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <WrapPanel ItemHeight="384" ItemWidth="632">
                 <hc:CompareSlider Value="5" Width="600" Height="352">
                     <hc:CompareSlider.TargetContent>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverFlowDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverFlowDemoCtl.xaml
index 742adf40..f67804dd 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverFlowDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverFlowDemoCtl.xaml
@@ -4,6 +4,8 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:CoverFlow x:Name="CoverFlowMain" Margin="32" Width="500" Height="300"/>
+        <Viewbox MaxWidth="500">
+            <hc:CoverFlow x:Name="CoverFlowMain" Margin="32" Width="500" Height="300"/>
+        </Viewbox>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverViewDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverViewDemoCtl.xaml
index cc3ff299..7bf7739d 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverViewDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/CoverViewDemoCtl.xaml
@@ -7,19 +7,21 @@
              DataContext="{Binding CoverView,Source={StaticResource Locator}}"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:CoverView Margin="27" Width="880" Height="432" ItemWidth="160" ItemHeight="160" ItemsSource="{Binding DataList}">
-            <hc:CoverView.ItemHeaderTemplate>
-                <DataTemplate>
-                    <Image Source="{Binding ImgPath}"/>
-                </DataTemplate>
-            </hc:CoverView.ItemHeaderTemplate>
-            <hc:CoverView.ItemTemplate>
-                <DataTemplate>
-                    <Border Margin="10" Height="300" Background="{Binding BackgroundToken,Converter={StaticResource String2BrushConverter}}">
-                        <TextBlock Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
-                    </Border>
-                </DataTemplate>
-            </hc:CoverView.ItemTemplate>
-        </hc:CoverView>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:CoverView Margin="27" MaxWidth="880" ItemWidth="160" ItemHeight="160" ItemsSource="{Binding DataList}">
+                <hc:CoverView.ItemHeaderTemplate>
+                    <DataTemplate>
+                        <Image Source="{Binding ImgPath}"/>
+                    </DataTemplate>
+                </hc:CoverView.ItemHeaderTemplate>
+                <hc:CoverView.ItemTemplate>
+                    <DataTemplate>
+                        <Border Margin="10" Height="300" Background="{Binding BackgroundToken,Converter={StaticResource String2BrushConverter}}">
+                            <TextBlock Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
+                        </Border>
+                    </DataTemplate>
+                </hc:CoverView.ItemTemplate>
+            </hc:CoverView>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DatePickerDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DatePickerDemoCtl.xaml
index 8d946d1a..b7dd79c6 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DatePickerDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DatePickerDemoCtl.xaml
@@ -7,7 +7,7 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <ScrollViewer>
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
                 <StackPanel>
                     <hc:DatePicker ShowClearButton="True" SelectedDate="{x:Static system:DateTime.Now}"/>
@@ -30,6 +30,6 @@
                     <hc:DatePicker Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0" Style="{StaticResource DatePickerPlus.Small}"/>
                 </StackPanel>
             </hc:UniformSpacingPanel>
-        </ScrollViewer>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DateTimePickerDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DateTimePickerDemoCtl.xaml
index 971f319c..0f14ce55 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DateTimePickerDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DateTimePickerDemoCtl.xaml
@@ -6,7 +6,7 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <ScrollViewer>
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <hc:UniformSpacingPanel  Spacing="32" Margin="32" ChildWrapping="Wrap">
                 <StackPanel>
                     <hc:DateTimePicker ShowClearButton="True"/>
@@ -49,6 +49,6 @@
                     <hc:DateTimePicker Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource DateTimePickerPlus.Small}" hc:InfoElement.Necessary="True" Margin="0,16,0,0"/>
                 </StackPanel>
             </hc:UniformSpacingPanel>
-        </ScrollViewer>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DividerDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DividerDemoCtl.xaml
index 3bb2853a..62c81bf1 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DividerDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/DividerDemoCtl.xaml
@@ -6,39 +6,41 @@
              xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension">
     <hc:TransitioningContentControl>
-        <WrapPanel Margin="16">
-            <StackPanel Margin="16" Width="300">
-                <hc:Divider/>
-                <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}"/>
-                <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}" Padding="10,0"/>
-                <hc:Divider LineStrokeThickness="2" LineStroke="{DynamicResource DarkPrimaryBrush}"/>
-                <hc:Divider LineStrokeDashArray="2,2"/>
-            </StackPanel>
-            <StackPanel Margin="16" Width="300">
-                <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}" HorizontalContentAlignment="Left"/>
-                <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}" Padding="10,0"  HorizontalContentAlignment="Right"/>
-                <StackPanel Orientation="Horizontal">
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <hc:Divider Orientation="Vertical" MaxHeight="16"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <hc:Divider Orientation="Vertical" MaxHeight="16"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" Spacing="32" ChildWrapping="Wrap">
+                <StackPanel Width="300">
+                    <hc:Divider/>
+                    <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}"/>
+                    <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}" Padding="10,0"/>
+                    <hc:Divider LineStrokeThickness="2" LineStroke="{DynamicResource DarkPrimaryBrush}"/>
+                    <hc:Divider LineStrokeDashArray="2,2"/>
                 </StackPanel>
-                <StackPanel Orientation="Horizontal" Margin="0,16,0,0">
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <hc:Divider LineStrokeThickness="2" Orientation="Vertical" MaxHeight="16"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <hc:Divider LineStrokeThickness="2" Orientation="Vertical" MaxHeight="16"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                <StackPanel Width="300">
+                    <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}" HorizontalContentAlignment="Left"/>
+                    <hc:Divider Content="{ex:Lang Key={x:Static langs:LangKeys.Title}}" Padding="10,0" HorizontalContentAlignment="Right"/>
+                    <StackPanel Orientation="Horizontal">
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <hc:Divider Orientation="Vertical" MaxHeight="16"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <hc:Divider Orientation="Vertical" MaxHeight="16"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                    </StackPanel>
+                    <StackPanel Orientation="Horizontal" Margin="0,16,0,0">
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <hc:Divider LineStrokeThickness="2" Orientation="Vertical" MaxHeight="16"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <hc:Divider LineStrokeThickness="2" Orientation="Vertical" MaxHeight="16"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                    </StackPanel>
+                    <StackPanel Orientation="Horizontal" Margin="0,16,0,0">
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <hc:Divider LineStrokeThickness="2" LineStroke="{DynamicResource DarkPrimaryBrush}" Orientation="Vertical" MaxHeight="16"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                        <hc:Divider LineStrokeThickness="2" LineStroke="{DynamicResource DarkPrimaryBrush}" Orientation="Vertical" MaxHeight="16"/>
+                        <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
+                    </StackPanel>
                 </StackPanel>
-                <StackPanel Orientation="Horizontal" Margin="0,16,0,0">
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <hc:Divider LineStrokeThickness="2" LineStroke="{DynamicResource DarkPrimaryBrush}" Orientation="Vertical" MaxHeight="16"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                    <hc:Divider LineStrokeThickness="2" LineStroke="{DynamicResource DarkPrimaryBrush}" Orientation="Vertical" MaxHeight="16"/>
-                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
-                </StackPanel>
-            </StackPanel>
-        </WrapPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ElementGroupDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ElementGroupDemoCtl.xaml
index afe53368..a14d51db 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ElementGroupDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ElementGroupDemoCtl.xaml
@@ -13,7 +13,7 @@
                 <Button HorizontalAlignment="Stretch" Width="auto" Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
                 <Button HorizontalAlignment="Stretch" Width="auto" Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
             </hc:ElementGroup>
-            <hc:ElementGroup Orientation="Horizontal" Width="500">
+            <hc:ElementGroup Orientation="Horizontal" MaxWidth="500">
                 <ToggleButton HorizontalAlignment="Stretch" Width="auto" Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
                 <Button HorizontalAlignment="Stretch" Width="auto" Content="{ex:Lang Key={x:Static langs:LangKeys.Button}}"/>
                 <ToggleButton HorizontalAlignment="Stretch" Width="auto" Content="{ex:Lang Key={x:Static langs:LangKeys.ToggleButton}}"/>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlexPanelDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlexPanelDemoCtl.xaml
index c55f1b4c..183f0232 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlexPanelDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlexPanelDemoCtl.xaml
@@ -12,7 +12,7 @@
         </Style>
     </UserControl.Resources>
     <hc:TransitioningContentControl>
-        <ScrollViewer>
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <hc:FlexPanel Margin="32" AlignItems="FlexStart" AlignContent="SpaceBetween" JustifyContent="SpaceAround" FlexWrap="WrapReverse" FlexDirection="RowReverse">
                 <Border hc:FlexPanel.Order="99" Height="50" Style="{StaticResource Border4FlexPanelDemoStyle}">
                     <TextBlock Text="0" Style="{StaticResource TextBlockTitle}"/>
@@ -45,6 +45,6 @@
                     <TextBlock Text="9" Style="{StaticResource TextBlockTitle}"/>
                 </Border>
             </hc:FlexPanel>
-        </ScrollViewer>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlipClockDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlipClockDemoCtl.xaml
index 8e2f08b2..e2240307 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlipClockDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/FlipClockDemoCtl.xaml
@@ -4,6 +4,8 @@
              Background="{DynamicResource RegionBrush}"
              xmlns:hc="https://handyorg.github.io/handycontrol">
     <hc:TransitioningContentControl>
-        <hc:FlipClock Margin="32"/>
+        <Viewbox MaxWidth="520">
+            <hc:FlipClock Margin="32"/>
+        </Viewbox>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GotoTopDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GotoTopDemoCtl.xaml
index 6ab499a8..055f8d70 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GotoTopDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GotoTopDemoCtl.xaml
@@ -4,7 +4,7 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:SimplePanel Width="500" Height="400">
+        <hc:SimplePanel Height="400">
             <hc:ScrollViewer Name="ScrollViewerDemo" IsInertiaEnabled="True" Margin="0,10,0,0">
                 <Border Height="2000" Margin="8,0">
                     <Border.Background>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GravatarDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GravatarDemoCtl.xaml
index 98ecc600..4b5c9ffc 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GravatarDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GravatarDemoCtl.xaml
@@ -4,24 +4,26 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <StackPanel Margin="32" Orientation="Horizontal">
-            <UniformGrid Rows="3" Columns="3" Width="240" Height="240">
-                <hc:Gravatar Id="User1"/>
-                <hc:Gravatar Id="User2"/>
-                <hc:Gravatar Style="{StaticResource GravatarCircleImg}">
-                    <Image Source="/HandyControlDemo;component/Resources/Img/Album/2.jpg"/>
-                </hc:Gravatar>
-                <hc:Gravatar Id="User4"/>
-                <hc:Gravatar Id="User5" Style="{StaticResource GravatarCircle}"/>
-                <hc:Gravatar Id="User6"/>
-                <hc:Gravatar Style="{StaticResource GravatarCircle}" Source="/HandyControlDemo;component/Resources/Img/Album/1.jpg"/>
-                <hc:Gravatar Id="User8"/>
-                <hc:Gravatar Id="User9"/>
-            </UniformGrid>
-            <StackPanel Margin="16,0,0,0" Height="220" VerticalAlignment="Center">
-                <TextBox Text="User1" Name="TextBoxName" Width="180"/>
-                <hc:Gravatar Height="180" Width="180" Id="{Binding Text,ElementName=TextBoxName}" Margin="10"/>
-            </StackPanel>
-        </StackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" ChildWrapping="Wrap" Spacing="16" ItemHorizontalAlignment="Center">
+                <UniformGrid Rows="3" Columns="3" Width="240" Height="240">
+                    <hc:Gravatar Id="User1"/>
+                    <hc:Gravatar Id="User2"/>
+                    <hc:Gravatar Style="{StaticResource GravatarCircleImg}">
+                        <Image Source="/HandyControlDemo;component/Resources/Img/Album/2.jpg"/>
+                    </hc:Gravatar>
+                    <hc:Gravatar Id="User4"/>
+                    <hc:Gravatar Id="User5" Style="{StaticResource GravatarCircle}"/>
+                    <hc:Gravatar Id="User6"/>
+                    <hc:Gravatar Style="{StaticResource GravatarCircle}" Source="/HandyControlDemo;component/Resources/Img/Album/1.jpg"/>
+                    <hc:Gravatar Id="User8"/>
+                    <hc:Gravatar Id="User9"/>
+                </UniformGrid>
+                <StackPanel Width="240" Height="220" VerticalAlignment="Center">
+                    <TextBox Text="User1" Name="TextBoxName" Width="180"/>
+                    <hc:Gravatar Height="180" Width="180" Id="{Binding Text,ElementName=TextBoxName}" Margin="10"/>
+                </StackPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GridDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GridDemoCtl.xaml
index 29eb161a..1ab2917f 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GridDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/GridDemoCtl.xaml
@@ -6,7 +6,7 @@
              xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
-    <ScrollViewer>
+    <hc:ScrollViewer IsInertiaEnabled="True">
         <StackPanel Margin="32">
             <TextBlock Text="{ex:Lang Key={x:Static langs:LangKeys.BasicLayout}}" Style="{StaticResource TextBlockLargeBold}" HorizontalAlignment="Left"/>
             <hc:Row Margin="0,20,0,0">
@@ -154,5 +154,5 @@
                 </hc:Col>
             </hc:Row>
         </StackPanel>
-    </ScrollViewer>
+    </hc:ScrollViewer>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBlockDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBlockDemoCtl.xaml
index 75ee0588..bf300da0 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBlockDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBlockDemoCtl.xaml
@@ -4,17 +4,19 @@
              Background="{DynamicResource RegionBrush}"
              xmlns:hc="https://handyorg.github.io/handycontrol">
     <hc:TransitioningContentControl>
-        <UniformGrid Rows="3" Columns="4" Margin="32">
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="0" EndColumn="7" EndRow="0" Width="110" Height="128" IsPlaying="True"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="1" EndColumn="7" EndRow="1" Width="110" Height="128" IsPlaying="True"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="2" EndColumn="7" EndRow="2" Width="110" Height="128" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="3" EndColumn="7" EndRow="3" Width="110" Height="128" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.1" Columns="8" Rows="10" StartColumn="0" StartRow="4" EndColumn="7" EndRow="4" Width="110" Height="128" IsPlaying="True"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="5" EndColumn="7" EndRow="5" Width="110" Height="128" IsPlaying="True"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="6" EndColumn="7" EndRow="6" Width="110" Height="128" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.1" Columns="8" Rows="10" StartColumn="0" StartRow="7" EndColumn="7" EndRow="7" Width="110" Height="128" IsPlaying="True"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="8" EndColumn="7" EndRow="8" Width="110" Height="128" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
-            <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="9" EndColumn="7" EndRow="9" Width="110" Height="128" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
-        </UniformGrid>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" ChildWrapping="Wrap" HorizontalAlignment="Center" VerticalAlignment="Center" ItemWidth="110" ItemHeight="128">
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="0" EndColumn="7" EndRow="0" IsPlaying="True"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="1" EndColumn="7" EndRow="1" IsPlaying="True"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="2" EndColumn="7" EndRow="2" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="3" EndColumn="7" EndRow="3" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.1" Columns="8" Rows="10" StartColumn="0" StartRow="4" EndColumn="7" EndRow="4" IsPlaying="True"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="5" EndColumn="7" EndRow="5" IsPlaying="True"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="6" EndColumn="7" EndRow="6" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.1" Columns="8" Rows="10" StartColumn="0" StartRow="7" EndColumn="7" EndRow="7" IsPlaying="True"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="8" EndColumn="7" EndRow="8" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
+                <hc:ImageBlock Source="/HandyControlDemo;component/Resources/Img/Dance.png" Interval="0:0:0.125" Columns="8" Rows="10" StartColumn="0" StartRow="9" EndColumn="7" EndRow="9" IsPlaying="{Binding IsMouseOver,RelativeSource={RelativeSource Self}}"/>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
-</UserControl>
\ No newline at end of file
+</UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBrowserDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBrowserDemoCtl.xaml
index be1672ce..f39b909f 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBrowserDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageBrowserDemoCtl.xaml
@@ -8,7 +8,7 @@
              xmlns:hc="https://handyorg.github.io/handycontrol">
     <hc:TransitioningContentControl>
         <StackPanel Margin="32">
-            <hc:ImageViewer Background="{DynamicResource SecondaryRegionBrush}" Width="600" Height="330" ImageSource="/HandyControlDemo;component/Resources/Img/1.jpg"/>
+            <hc:ImageViewer Background="{DynamicResource SecondaryRegionBrush}" MaxWidth="600" Height="330" ImageSource="/HandyControlDemo;component/Resources/Img/1.jpg"/>
             <Button Margin="0,32,0,0" Command="{Binding OpenImgCmd}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenImageBrowser}}" Style="{StaticResource ButtonPrimary}" HorizontalAlignment="Center"/>
         </StackPanel>
     </hc:TransitioningContentControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageSelectorDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageSelectorDemoCtl.xaml
index a08ee288..15d5be6b 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageSelectorDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ImageSelectorDemoCtl.xaml
@@ -4,13 +4,15 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:hc="https://handyorg.github.io/handycontrol">
     <hc:TransitioningContentControl>
-        <UniformGrid Columns="3" Margin="16">
-            <hc:ImageSelector Width="100" Height="100" Margin="16"/>
-            <hc:ImageSelector Width="100" Height="100" Margin="16" hc:BorderElement.CornerRadius="50"/>
-            <hc:ImageSelector Width="100" Height="100" Margin="16" hc:BorderElement.CornerRadius="50" StrokeDashArray="10,5"/>
-            <hc:ImageSelector Width="100" Height="100" Margin="16" hc:BorderElement.CornerRadius="50" BorderBrush="{DynamicResource SuccessBrush}"/>
-            <hc:ImageSelector Width="100" Height="100" Margin="16" hc:BorderElement.CornerRadius="50" StrokeDashArray="10,5,10" BorderBrush="{DynamicResource DangerBrush}"/>
-            <hc:ImageSelector Width="100" Height="100" Margin="16" hc:BorderElement.CornerRadius="10" StrokeThickness="2" BorderThickness="2" BorderBrush="{DynamicResource PrimaryBrush}"/>
-        </UniformGrid>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" ChildWrapping="Wrap" VerticalAlignment="Center" Spacing="32" HorizontalAlignment="Center">
+                <hc:ImageSelector Width="100" Height="100"/>
+                <hc:ImageSelector Width="100" Height="100" hc:BorderElement.CornerRadius="50"/>
+                <hc:ImageSelector Width="100" Height="100" hc:BorderElement.CornerRadius="50" StrokeDashArray="10,5"/>
+                <hc:ImageSelector Width="100" Height="100" hc:BorderElement.CornerRadius="50" BorderBrush="{DynamicResource SuccessBrush}"/>
+                <hc:ImageSelector Width="100" Height="100" hc:BorderElement.CornerRadius="50" StrokeDashArray="10,5,10" BorderBrush="{DynamicResource DangerBrush}"/>
+                <hc:ImageSelector Width="100" Height="100" hc:BorderElement.CornerRadius="10" StrokeThickness="2" BorderThickness="2" BorderBrush="{DynamicResource PrimaryBrush}"/>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/MagnifierDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/MagnifierDemoCtl.xaml
index 4851dca1..ba0c5059 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/MagnifierDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/MagnifierDemoCtl.xaml
@@ -4,14 +4,16 @@
              Background="{DynamicResource RegionBrush}"
              xmlns:hc="https://handyorg.github.io/handycontrol">
     <hc:TransitioningContentControl>
-        <WrapPanel Margin="16">
-            <Image Margin="16" hc:Magnifier.Instance="{x:Static hc:Magnifier.Default}" Source="/HandyControlDemo;component/Resources/Img/b1.jpg" Stretch="None" RenderOptions.BitmapScalingMode="NearestNeighbor"/>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel ChildWrapping="Wrap" Spacing="32" Margin="32">
+                <Image hc:Magnifier.Instance="{x:Static hc:Magnifier.Default}" Source="/HandyControlDemo;component/Resources/Img/b1.jpg" Stretch="None" RenderOptions.BitmapScalingMode="NearestNeighbor"/>
 
-            <Image Margin="16" Source="/HandyControlDemo;component/Resources/Img/b1.jpg" Stretch="None" RenderOptions.BitmapScalingMode="NearestNeighbor">
-                <hc:Magnifier.Instance>
-                    <hc:Magnifier Scale="6" HorizontalOffset="-16" VerticalOffset="-16"/>
-                </hc:Magnifier.Instance>
-            </Image>
-        </WrapPanel>
+                <Image Source="/HandyControlDemo;component/Resources/Img/b1.jpg" Stretch="None" RenderOptions.BitmapScalingMode="NearestNeighbor">
+                    <hc:Magnifier.Instance>
+                        <hc:Magnifier Scale="6" HorizontalOffset="-16" VerticalOffset="-16"/>
+                    </hc:Magnifier.Instance>
+                </Image>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml
index c7c9cfae..5ddf70dd 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml
@@ -8,63 +8,65 @@
              Background="{DynamicResource RegionBrush}"
              DataContext="{Binding InputElementDemo, Source={StaticResource Locator}}">
     <hc:TransitioningContentControl>
-        <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
-            <StackPanel>
-                <hc:NumericUpDown Maximum="100"/>
-                <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False"/>
-                <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True"/>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
+                <StackPanel>
+                    <hc:NumericUpDown Maximum="100"/>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False"/>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True"/>
 
-                <hc:NumericUpDown hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownExtend}"/>
-                <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownExtend}"/>
-                <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend}" Margin="0,32,0,0"/>
-                <hc:NumericUpDown ValueFormat="N2" Maximum="100000" Value="10000" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" Style="{StaticResource NumericUpDownPlus}">
-                    <hc:NumericUpDown.Value>
-                        <Binding Path="DoubleValue1" UpdateSourceTrigger="PropertyChanged">
-                            <Binding.ValidationRules>
-                                <tools:NumericUpDownDemoRule/>
-                            </Binding.ValidationRules>
-                        </Binding>
-                    </hc:NumericUpDown.Value>
-                </hc:NumericUpDown>
-                <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource NumericUpDownPlus}"/>
-                <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True" Style="{StaticResource NumericUpDownPlus}"/>
+                    <hc:NumericUpDown hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownExtend}"/>
+                    <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownExtend}"/>
+                    <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend}" Margin="0,32,0,0"/>
+                    <hc:NumericUpDown ValueFormat="N2" Maximum="100000" Value="10000" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" Style="{StaticResource NumericUpDownPlus}">
+                        <hc:NumericUpDown.Value>
+                            <Binding Path="DoubleValue1" UpdateSourceTrigger="PropertyChanged">
+                                <Binding.ValidationRules>
+                                    <tools:NumericUpDownDemoRule/>
+                                </Binding.ValidationRules>
+                            </Binding>
+                        </hc:NumericUpDown.Value>
+                    </hc:NumericUpDown>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource NumericUpDownPlus}"/>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True" Style="{StaticResource NumericUpDownPlus}"/>
 
-                <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownPlus}"/>
-                <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownPlus}"/>
-                <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus}" Margin="0,32,0,0"/>
-                <hc:NumericUpDown DecimalPlaces="2" hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:NumericUpDown Maximum="100" Style="{StaticResource NumericUpDown.Small}"/>
-                <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource NumericUpDown.Small}"/>
-                <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True" Style="{StaticResource NumericUpDown.Small}"/>
+                    <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownPlus}"/>
+                    <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownPlus}"/>
+                    <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus}" Margin="0,32,0,0"/>
+                    <hc:NumericUpDown DecimalPlaces="2" hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:NumericUpDown Maximum="100" Style="{StaticResource NumericUpDown.Small}"/>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource NumericUpDown.Small}"/>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True" Style="{StaticResource NumericUpDown.Small}"/>
 
-                <hc:NumericUpDown hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownExtend.Small}"/>
-                <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownExtend.Small}"/>
-                <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend.Small}" Margin="0,32,0,0"/>
-                <hc:NumericUpDown ValueFormat="N2" Maximum="100000" Value="10000" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" Style="{StaticResource NumericUpDownPlus.Small}">
-                    <hc:NumericUpDown.Value>
-                        <Binding Path="DoubleValue2" UpdateSourceTrigger="PropertyChanged">
-                            <Binding.ValidationRules>
-                                <tools:NumericUpDownDemoRule/>
-                            </Binding.ValidationRules>
-                        </Binding>
-                    </hc:NumericUpDown.Value>
-                </hc:NumericUpDown>
-                <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource NumericUpDownPlus.Small}"/>
-                <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True" Style="{StaticResource NumericUpDownPlus.Small}"/>
+                    <hc:NumericUpDown hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownExtend.Small}"/>
+                    <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownExtend.Small}"/>
+                    <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend.Small}" Margin="0,32,0,0"/>
+                    <hc:NumericUpDown ValueFormat="N2" Maximum="100000" Value="10000" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownExtend.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" Style="{StaticResource NumericUpDownPlus.Small}">
+                        <hc:NumericUpDown.Value>
+                            <Binding Path="DoubleValue2" UpdateSourceTrigger="PropertyChanged">
+                                <Binding.ValidationRules>
+                                    <tools:NumericUpDownDemoRule/>
+                                </Binding.ValidationRules>
+                            </Binding>
+                        </hc:NumericUpDown.Value>
+                    </hc:NumericUpDown>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource NumericUpDownPlus.Small}"/>
+                    <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True" Style="{StaticResource NumericUpDownPlus.Small}"/>
 
-                <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownPlus.Small}"/>
-                <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownPlus.Small}"/>
-                <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus.Small}" Margin="0,32,0,0"/>
-                <hc:NumericUpDown DecimalPlaces="2" hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-        </hc:UniformSpacingPanel>
+                    <hc:NumericUpDown hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownPlus.Small}"/>
+                    <hc:NumericUpDown hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownPlus.Small}"/>
+                    <hc:NumericUpDown Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus.Small}" Margin="0,32,0,0"/>
+                    <hc:NumericUpDown DecimalPlaces="2" hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource NumericUpDownPlus.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/OutlineTextDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/OutlineTextDemoCtl.xaml
index 1d93bf32..d8ba610b 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/OutlineTextDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/OutlineTextDemoCtl.xaml
@@ -6,14 +6,16 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <StackPanel Margin="32" Width="400">
-            <hc:OutlineText TextWrapping="Wrap" Fill="{DynamicResource PrimaryTextBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=20}"/>
-            <hc:OutlineText Margin="0,10,0,0" FontSize="30" Fill="{DynamicResource SuccessBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=8}"/>
-            <hc:OutlineText Margin="0,10,0,0" Fill="{DynamicResource PrimaryTextBrush}" FontSize="30" FontStyle="Italic" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=8}"/>
-            <hc:OutlineText Margin="0,10,0,0" TextWrapping="Wrap" TextTrimming="CharacterEllipsis" FontSize="50" StrokeThickness="2" Fill="{DynamicResource DangerBrush}" Stroke="{DynamicResource PrimaryBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
-            <hc:OutlineText Margin="0,10,0,0" FontSize="80" FontWeight="Bold" StrokeThickness="4" Fill="{DynamicResource PrimaryBrush}" Stroke="{DynamicResource DangerBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
-            <hc:OutlineText Margin="0,10,0,0" StrokePosition="Outside" FontSize="80" FontWeight="Bold" StrokeThickness="4" Fill="{DynamicResource PrimaryBrush}" Stroke="{DynamicResource DangerBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
-            <hc:OutlineText Margin="0,10,0,0" StrokePosition="InSide" FontSize="80" FontWeight="Bold" StrokeThickness="4" Fill="{DynamicResource PrimaryBrush}" Stroke="{DynamicResource DangerBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
-        </StackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <StackPanel Margin="32" Width="400">
+                <hc:OutlineText TextWrapping="Wrap" Fill="{DynamicResource PrimaryTextBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=20}"/>
+                <hc:OutlineText FontSize="30" Fill="{DynamicResource SuccessBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=8}"/>
+                <hc:OutlineText Fill="{DynamicResource PrimaryTextBrush}" FontSize="30" FontStyle="Italic" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=8}"/>
+                <hc:OutlineText TextWrapping="Wrap" TextTrimming="CharacterEllipsis" FontSize="50" StrokeThickness="2" Fill="{DynamicResource DangerBrush}" Stroke="{DynamicResource PrimaryBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
+                <hc:OutlineText FontSize="80" FontWeight="Bold" StrokeThickness="4" Fill="{DynamicResource PrimaryBrush}" Stroke="{DynamicResource DangerBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
+                <hc:OutlineText StrokePosition="Outside" FontSize="80" FontWeight="Bold" StrokeThickness="4" Fill="{DynamicResource PrimaryBrush}" Stroke="{DynamicResource DangerBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
+                <hc:OutlineText StrokePosition="InSide" FontSize="80" FontWeight="Bold" StrokeThickness="4" Fill="{DynamicResource PrimaryBrush}" Stroke="{DynamicResource DangerBrush}" Text="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
+            </StackPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PaginationDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PaginationDemoCtl.xaml
index 2bf36b55..d5c3ba2b 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PaginationDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PaginationDemoCtl.xaml
@@ -19,7 +19,7 @@
                     </hc:EventTrigger>
                 </hc:Interaction.Triggers>
             </hc:Pagination>
-            <DataGrid IsReadOnly="True" Width="600" Margin="0,16,0,0" Grid.Row="1" HeadersVisibility="All" RowHeaderWidth="60" AutoGenerateColumns="False" ItemsSource="{Binding DataList}">
+            <DataGrid IsReadOnly="True" MaxWidth="600" Margin="0,16,0,0" Grid.Row="1" HeadersVisibility="All" RowHeaderWidth="60" AutoGenerateColumns="False" ItemsSource="{Binding DataList}">
                 <DataGrid.RowHeaderTemplate>
                     <DataTemplate>
                         <CheckBox IsChecked="{Binding IsSelected,RelativeSource={RelativeSource AncestorType=DataGridRow}}"/>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PasswordBoxDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PasswordBoxDemoCtl.xaml
index 1d2a0bd5..0059b3cc 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PasswordBoxDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PasswordBoxDemoCtl.xaml
@@ -6,29 +6,31 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
-            <StackPanel>
-                <hc:PasswordBox Name="PasswordBoxDemo" ShowClearButton="True" Password="123456" IsSafeEnabled="False"/>
-                <TextBox Text="{Binding UnsafePassword,ElementName=PasswordBoxDemo,UpdateSourceTrigger=PropertyChanged}" Margin="0,6,0,0"/>
-                <hc:PasswordBox Password="123456" Margin="0,16,0,0"/>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
+                <StackPanel>
+                    <hc:PasswordBox Name="PasswordBoxDemo" ShowClearButton="True" Password="123456" IsSafeEnabled="False"/>
+                    <TextBox Text="{Binding UnsafePassword,ElementName=PasswordBoxDemo,UpdateSourceTrigger=PropertyChanged}" Margin="0,6,0,0"/>
+                    <hc:PasswordBox Password="123456" Margin="0,16,0,0"/>
 
-                <hc:PasswordBox ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Password="123456" Margin="0,32,0,0"/>
-                <hc:PasswordBox ShowEyeButton="True" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                    <hc:PasswordBox ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Password="123456" Margin="0,32,0,0"/>
+                    <hc:PasswordBox ShowEyeButton="True" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
 
-                <hc:PasswordBox ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Password="123456"/>
-                <hc:PasswordBox ShowClearButton="True" ShowEyeButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:PasswordBox Name="PasswordBoxDemoSmall" ShowClearButton="True" Password="123456" IsSafeEnabled="False" Style="{StaticResource PasswordBoxPlus.Small}"/>
-                <TextBox Text="{Binding UnsafePassword,ElementName=PasswordBoxDemoSmall,UpdateSourceTrigger=PropertyChanged}" Margin="0,6,0,0"/>
-                <hc:PasswordBox Password="123456" Margin="0,16,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
+                    <hc:PasswordBox ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Password="123456"/>
+                    <hc:PasswordBox ShowClearButton="True" ShowEyeButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:PasswordBox Name="PasswordBoxDemoSmall" ShowClearButton="True" Password="123456" IsSafeEnabled="False" Style="{StaticResource PasswordBoxPlus.Small}"/>
+                    <TextBox Text="{Binding UnsafePassword,ElementName=PasswordBoxDemoSmall,UpdateSourceTrigger=PropertyChanged}" Margin="0,6,0,0"/>
+                    <hc:PasswordBox Password="123456" Margin="0,16,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
 
-                <hc:PasswordBox ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Password="123456" Margin="0,32,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
-                <hc:PasswordBox ShowEyeButton="True" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
+                    <hc:PasswordBox ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Password="123456" Margin="0,32,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
+                    <hc:PasswordBox ShowEyeButton="True" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
 
-                <hc:PasswordBox ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Password="123456" Style="{StaticResource PasswordBoxPlus.Small}"/>
-                <hc:PasswordBox ShowClearButton="True" ShowEyeButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
-            </StackPanel>
-        </hc:UniformSpacingPanel>
+                    <hc:PasswordBox ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Password="123456" Style="{StaticResource PasswordBoxPlus.Small}"/>
+                    <hc:PasswordBox ShowClearButton="True" ShowEyeButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,32,0,0" Style="{StaticResource PasswordBoxPlus.Small}"/>
+                </StackPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PoptipDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PoptipDemoCtl.xaml
index 0f9947ce..ab9e5ff0 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PoptipDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/PoptipDemoCtl.xaml
@@ -10,14 +10,12 @@
         <Style x:Key="Button4PoptipStyle" BasedOn="{StaticResource {x:Type Button}}" TargetType="Button">
             <Setter Property="Width" Value="{x:Static system:Double.NaN}"/>
             <Setter Property="Height" Value="40"/>
-            <Setter Property="MinWidth" Value="100"/>
             <Setter Property="HorizontalAlignment" Value="Stretch"/>
             <Setter Property="Content" Value="{Binding Tag,RelativeSource={RelativeSource Self},Converter={StaticResource Int2StringConverter},ConverterParameter={ex:Lang Key={x:Static langs:LangKeys.PoptipPositionStr}}}"/>
         </Style>
         <Style x:Key="ToggleButton4PoptipStyle" BasedOn="{StaticResource {x:Type ToggleButton}}" TargetType="ToggleButton">
             <Setter Property="Width" Value="{x:Static system:Double.NaN}"/>
             <Setter Property="Height" Value="40"/>
-            <Setter Property="MinWidth" Value="100"/>
             <Setter Property="HorizontalAlignment" Value="Stretch"/>
             <Setter Property="Content" Value="{Binding Tag,RelativeSource={RelativeSource Self},Converter={StaticResource Int2StringConverter},ConverterParameter={ex:Lang Key={x:Static langs:LangKeys.PoptipPositionStr}}}"/>
         </Style>
@@ -35,12 +33,12 @@
                 <RowDefinition/>
             </Grid.RowDefinitions>
             <UniformGrid Grid.Column="1" Columns="3">
-                <Button Margin="8,0" Tag="0" Style="{StaticResource Button4PoptipStyle}">
+                <Button Margin="8,0" Tag="TopLeft" Style="{StaticResource Button4PoptipStyle}">
                     <hc:Poptip.Instance>
                         <hc:Poptip Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" PlacementType="TopLeft"/>
                     </hc:Poptip.Instance>
                 </Button>
-                <Button Margin="8,0" Tag="1" Style="{StaticResource Button4PoptipStyle}">
+                <Button Margin="8,0" Tag="Top" Style="{StaticResource Button4PoptipStyle}">
                     <hc:Poptip.Instance>
                         <hc:Poptip PlacementType="Top">
                             <hc:Poptip.Content>
@@ -49,11 +47,11 @@
                         </hc:Poptip>
                     </hc:Poptip.Instance>
                 </Button>
-                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="TopRight" Margin="8,0" Tag="2" Style="{StaticResource Button4PoptipStyle}"/>
+                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="TopRight" Margin="8,0" Tag="TopRight" Style="{StaticResource Button4PoptipStyle}"/>
             </UniformGrid>
             <UniformGrid Grid.Row="1" Grid.Column="2" Rows="3">
-                <ToggleButton hc:Poptip.HitMode="None" hc:Poptip.IsOpen="{Binding IsChecked,RelativeSource={RelativeSource Self}}" hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="RightTop" Margin="8,16" Tag="3" Style="{StaticResource ToggleButton4PoptipStyle}"/>
-                <ToggleButton Margin="8,16" Tag="4" Style="{StaticResource ToggleButton4PoptipStyle}">
+                <ToggleButton hc:Poptip.HitMode="None" hc:Poptip.IsOpen="{Binding IsChecked,RelativeSource={RelativeSource Self}}" hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="RightTop" Margin="8,16" Tag="RightTop" Style="{StaticResource ToggleButton4PoptipStyle}"/>
+                <ToggleButton Margin="8,16" Tag="Right" Style="{StaticResource ToggleButton4PoptipStyle}">
                     <hc:Poptip.Instance>
                         <hc:Poptip Background="Transparent" Padding="0" BorderThickness="0" HitMode="None" PlacementType="Right" IsOpen="{Binding Target.IsChecked,RelativeSource={RelativeSource Self}}">
                             <hc:Poptip.Content>
@@ -62,17 +60,17 @@
                         </hc:Poptip>
                     </hc:Poptip.Instance>
                 </ToggleButton>
-                <ToggleButton hc:Poptip.HitMode="None" hc:Poptip.IsOpen="{Binding IsChecked,RelativeSource={RelativeSource Self}}" hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="RightBottom" Margin="8,16" Tag="5" Style="{StaticResource ToggleButton4PoptipStyle}"/>
+                <ToggleButton hc:Poptip.HitMode="None" hc:Poptip.IsOpen="{Binding IsChecked,RelativeSource={RelativeSource Self}}" hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="RightBottom" Margin="8,16" Tag="RightBottom" Style="{StaticResource ToggleButton4PoptipStyle}"/>
             </UniformGrid>
             <UniformGrid Grid.Column="1" Grid.Row="2" Columns="3">
-                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="BottomLeft" Margin="8,0" Tag="8" Style="{StaticResource Button4PoptipStyle}"/>
-                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="Bottom" Margin="8,0" Tag="7" Style="{StaticResource Button4PoptipStyle}"/>
-                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="BottomRight" Margin="8,0" Tag="6" Style="{StaticResource Button4PoptipStyle}"/>
+                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="BottomLeft" Margin="8,0" Tag="BottomLeft" Style="{StaticResource Button4PoptipStyle}"/>
+                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="Bottom" Margin="8,0" Tag="Bottom" Style="{StaticResource Button4PoptipStyle}"/>
+                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="BottomRight" Margin="8,0" Tag="BottomRight" Style="{StaticResource Button4PoptipStyle}"/>
             </UniformGrid>
             <UniformGrid Grid.Row="1" Grid.Column="0" Rows="3">
-                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="LeftTop" hc:Poptip.HitMode="Focus" Margin="8,16" Tag="11" Style="{StaticResource Button4PoptipStyle}"/>
-                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="Left" hc:Poptip.HitMode="Focus" Margin="8,16" Tag="10" Style="{StaticResource Button4PoptipStyle}"/>
-                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="LeftBottom" hc:Poptip.HitMode="Focus" Margin="8,16" Tag="9" Style="{StaticResource Button4PoptipStyle}"/>
+                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="LeftTop" hc:Poptip.HitMode="Focus" Margin="8,16" Tag="LeftTop" Style="{StaticResource Button4PoptipStyle}"/>
+                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="Left" hc:Poptip.HitMode="Focus" Margin="8,16" Tag="Left" Style="{StaticResource Button4PoptipStyle}"/>
+                <Button hc:Poptip.Content="{ex:Lang Key={x:Static langs:LangKeys.Text}}" hc:Poptip.Placement="LeftBottom" hc:Poptip.HitMode="Focus" Margin="8,16" Tag="LeftBottom" Style="{StaticResource Button4PoptipStyle}"/>
             </UniformGrid>
         </Grid>
     </hc:TransitioningContentControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ProgressButtonDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ProgressButtonDemoCtl.xaml
index 00aae1f9..32a3b95d 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ProgressButtonDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ProgressButtonDemoCtl.xaml
@@ -5,23 +5,25 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <WrapPanel Margin="16" VerticalAlignment="Center">
-            <StackPanel Margin="16" Button.Click="ButtonProgress_OnClick">
-                <hc:ProgressButton IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <hc:ProgressButton Style="{StaticResource ProgressButtonPrimary}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <hc:ProgressButton Style="{StaticResource ProgressButtonSuccess}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <hc:ProgressButton Style="{StaticResource ProgressButtonInfo}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <hc:ProgressButton Style="{StaticResource ProgressButtonWarning}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <hc:ProgressButton Style="{StaticResource ProgressButtonDanger}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-            </StackPanel>
-            <StackPanel Margin="16" Button.Click="ButtonProgress_OnClick">
-                <ToggleButton Style="{StaticResource ToggleButtonLoading}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <ToggleButton Style="{StaticResource ToggleButtonLoadingPrimary}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <ToggleButton Style="{StaticResource ToggleButtonLoadingSuccess}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <ToggleButton Style="{StaticResource ToggleButtonLoadingInfo}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <ToggleButton Style="{StaticResource ToggleButtonLoadingWarning}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-                <ToggleButton Style="{StaticResource ToggleButtonLoadingDanger}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
-            </StackPanel>
-        </WrapPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <WrapPanel Margin="16" VerticalAlignment="Center">
+                <StackPanel Margin="16" Button.Click="ButtonProgress_OnClick">
+                    <hc:ProgressButton IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <hc:ProgressButton Style="{StaticResource ProgressButtonPrimary}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <hc:ProgressButton Style="{StaticResource ProgressButtonSuccess}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <hc:ProgressButton Style="{StaticResource ProgressButtonInfo}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <hc:ProgressButton Style="{StaticResource ProgressButtonWarning}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <hc:ProgressButton Style="{StaticResource ProgressButtonDanger}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Progress="{Binding Progress}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                </StackPanel>
+                <StackPanel Margin="16" Button.Click="ButtonProgress_OnClick">
+                    <ToggleButton Style="{StaticResource ToggleButtonLoading}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <ToggleButton Style="{StaticResource ToggleButtonLoadingPrimary}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <ToggleButton Style="{StaticResource ToggleButtonLoadingSuccess}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <ToggleButton Style="{StaticResource ToggleButtonLoadingInfo}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <ToggleButton Style="{StaticResource ToggleButtonLoadingWarning}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                    <ToggleButton Style="{StaticResource ToggleButtonLoadingDanger}" IsChecked="{Binding IsUploading,Mode=TwoWay}" Content="{Binding IsChecked,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2StringConverter},ConverterParameter={x:Static langs:Lang.UploadStr}}" Width="180" Margin="5"/>
+                </StackPanel>
+            </WrapPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RangeSliderDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RangeSliderDemoCtl.xaml
index 8f4f3b99..3cc98cd0 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RangeSliderDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RangeSliderDemoCtl.xaml
@@ -4,19 +4,21 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <StackPanel Margin="32" Orientation="Horizontal">
-            <StackPanel>
-                <hc:RangeSlider Width="400" IsSnapToTickEnabled="True" ValueStart="2" ValueEnd="8"/>
-                <hc:RangeSlider Width="400" IsSnapToTickEnabled="True" ValueEnd="3" Margin="0,32,0,0" IsEnabled="False"/>
-                <hc:RangeSlider Width="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Top" IsSnapToTickEnabled="True" Maximum="100" ValueEnd="60" TickFrequency="10" TickPlacement="BottomRight" Margin="0,32,0,0"/>
-                <hc:RangeSlider Width="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Bottom" hc:TipElement.StringFormat="#0.00" ValueEnd="5" TickPlacement="Both" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel Margin="32,0,0,0" Orientation="Horizontal">
-                <hc:RangeSlider Height="400" IsSnapToTickEnabled="True" ValueEnd="8" Orientation="Vertical"/>
-                <hc:RangeSlider Height="400" IsSnapToTickEnabled="True" ValueEnd="3" Margin="32,0,0,0" IsEnabled="False" Orientation="Vertical"/>
-                <hc:RangeSlider Height="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Left" IsSnapToTickEnabled="True" Maximum="100" ValueEnd="60" TickFrequency="10" TickPlacement="BottomRight" Margin="32,0,0,0" Orientation="Vertical"/>
-                <hc:RangeSlider Height="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Right" hc:TipElement.StringFormat="#0.00" ValueEnd="5" TickPlacement="Both" Margin="32,0" Orientation="Vertical"/>
-            </StackPanel>
-        </StackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" Spacing="32">
+                <hc:UniformSpacingPanel Orientation="Vertical" Spacing="32">
+                    <hc:RangeSlider Width="400" IsSnapToTickEnabled="True" ValueStart="2" ValueEnd="8"/>
+                    <hc:RangeSlider Width="400" IsSnapToTickEnabled="True" ValueEnd="3" IsEnabled="False"/>
+                    <hc:RangeSlider Width="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Top" IsSnapToTickEnabled="True" Maximum="100" ValueEnd="60" TickFrequency="10" TickPlacement="BottomRight"/>
+                    <hc:RangeSlider Width="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Bottom" hc:TipElement.StringFormat="#0.00" ValueEnd="5" TickPlacement="Both"/>
+                </hc:UniformSpacingPanel>
+                <hc:UniformSpacingPanel Spacing="32">
+                    <hc:RangeSlider Height="400" IsSnapToTickEnabled="True" ValueEnd="8" Orientation="Vertical"/>
+                    <hc:RangeSlider Height="400" IsSnapToTickEnabled="True" ValueEnd="3" IsEnabled="False" Orientation="Vertical"/>
+                    <hc:RangeSlider Height="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Right" IsSnapToTickEnabled="True" Maximum="100" ValueEnd="60" TickFrequency="10" TickPlacement="BottomRight" Orientation="Vertical"/>
+                    <hc:RangeSlider Height="400" hc:TipElement.Visibility="Visible" hc:TipElement.Placement="Left" hc:TipElement.StringFormat="#0.00" ValueEnd="5" TickPlacement="Both" Orientation="Vertical"/>
+                </hc:UniformSpacingPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RelativePanelDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RelativePanelDemoCtl.xaml
index 87ca8eca..0e049bd1 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RelativePanelDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RelativePanelDemoCtl.xaml
@@ -4,58 +4,60 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:RelativePanel Width="620" Height="700" Margin="32">
-            <Border Name="Rect1" Background="{DynamicResource DangerBrush}" Height="50" Width="50">
-                <TextBlock Text="Rect1" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect2" Background="{DynamicResource PrimaryBrush}" Height="50" Width="50" hc:RelativePanel.AlignHorizontalCenterWithPanel="True">
-                <TextBlock Text="Rect2" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect3" Background="{DynamicResource SuccessBrush}" Height="50" Width="50" hc:RelativePanel.AlignRightWithPanel="True">
-                <TextBlock Text="Rect3" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect4" Background="{DynamicResource DangerBrush}" Height="50" Width="50" hc:RelativePanel.AlignBottomWithPanel="True">
-                <TextBlock Text="Rect4" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect5" Background="{DynamicResource PrimaryBrush}" Height="50" Width="50" hc:RelativePanel.AlignBottomWithPanel="True" hc:RelativePanel.AlignHorizontalCenterWithPanel="True">
-                <TextBlock Text="Rect5" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect6" Background="{DynamicResource SuccessBrush}" Height="50" Width="50" hc:RelativePanel.AlignBottomWithPanel="True" hc:RelativePanel.AlignRightWithPanel="True">
-                <TextBlock Text="Rect6" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect7" Background="{DynamicResource PrimaryBrush}" Height="50" hc:RelativePanel.RightOf="{Binding ElementName=Rect1}">
-                <TextBlock Text="Rect7 (RightOf Rect1)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect8" Background="{DynamicResource SuccessBrush}" Height="50" hc:RelativePanel.Below="{Binding ElementName=Rect7}">
-                <TextBlock Text="Rect8 (Below Rect7)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect9" Background="{DynamicResource PrimaryBrush}" Height="140" Width="460" hc:RelativePanel.AlignHorizontalCenterWithPanel="True" hc:RelativePanel.AlignVerticalCenterWithPanel="True">
-                <TextBlock Text="Rect9" Padding="10" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Top"/>
-            </Border>
-            <Border Name="Rect10" Background="{DynamicResource DangerBrush}" Width="50" hc:RelativePanel.RightOf="{Binding ElementName=Rect9}" hc:RelativePanel.AlignVerticalCenterWith="{Binding ElementName=Rect9}">
-                <TextBlock Text="Rect14 (RightOf Rect9, AlignVerticalCenterWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center">
-                    <TextBlock.LayoutTransform>
-                        <TransformGroup>
-                            <RotateTransform Angle="-90"/>
-                        </TransformGroup>
-                    </TextBlock.LayoutTransform>
-                </TextBlock>
-            </Border>
-            <Border Name="Rect11" Background="{DynamicResource DangerBrush}" Height="50" hc:RelativePanel.AlignBottomWith="{Binding ElementName=Rect9}" hc:RelativePanel.AlignHorizontalCenterWith="{Binding ElementName=Rect9}">
-                <TextBlock Text="Rect11 (AlignBottomWith Rect9, AlignHorizontalCenterWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect12" Background="{DynamicResource DangerBrush}" Height="50" hc:RelativePanel.Below="{Binding ElementName=Rect8}" hc:RelativePanel.AlignLeftWith="{Binding ElementName=Rect7}">
-                <TextBlock Text="Rect12 (Below Rect8, AlignLeftWith Rect7)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect13" Background="{DynamicResource PrimaryBrush}" Height="50" hc:RelativePanel.Below="{Binding ElementName=Rect12}" hc:RelativePanel.AlignRightWith="{Binding ElementName=Rect12}">
-                <TextBlock Text="Rect13 (Below Rect12, AlignRightWith Rect12)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect14" Background="{DynamicResource SuccessBrush}" Height="50" hc:RelativePanel.Above="{Binding ElementName=Rect9}" hc:RelativePanel.AlignRightWith="{Binding ElementName=Rect9}">
-                <TextBlock Text="Rect14 (Above Rect9, AlignRightWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-            <Border Name="Rect15" Background="{DynamicResource DangerBrush}" Height="50" hc:RelativePanel.LeftOf="{Binding ElementName=Rect2}" hc:RelativePanel.AlignTopWith="{Binding ElementName=Rect9}">
-                <TextBlock Text="Rect15 (LeftOf Rect2, AlignTopWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
-            </Border>
-        </hc:RelativePanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:RelativePanel Width="620" Height="700" Margin="32">
+                <Border Name="Rect1" Background="{DynamicResource DangerBrush}" Height="50" Width="50">
+                    <TextBlock Text="Rect1" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect2" Background="{DynamicResource PrimaryBrush}" Height="50" Width="50" hc:RelativePanel.AlignHorizontalCenterWithPanel="True">
+                    <TextBlock Text="Rect2" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect3" Background="{DynamicResource SuccessBrush}" Height="50" Width="50" hc:RelativePanel.AlignRightWithPanel="True">
+                    <TextBlock Text="Rect3" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect4" Background="{DynamicResource DangerBrush}" Height="50" Width="50" hc:RelativePanel.AlignBottomWithPanel="True">
+                    <TextBlock Text="Rect4" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect5" Background="{DynamicResource PrimaryBrush}" Height="50" Width="50" hc:RelativePanel.AlignBottomWithPanel="True" hc:RelativePanel.AlignHorizontalCenterWithPanel="True">
+                    <TextBlock Text="Rect5" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect6" Background="{DynamicResource SuccessBrush}" Height="50" Width="50" hc:RelativePanel.AlignBottomWithPanel="True" hc:RelativePanel.AlignRightWithPanel="True">
+                    <TextBlock Text="Rect6" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect7" Background="{DynamicResource PrimaryBrush}" Height="50" hc:RelativePanel.RightOf="{Binding ElementName=Rect1}">
+                    <TextBlock Text="Rect7 (RightOf Rect1)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect8" Background="{DynamicResource SuccessBrush}" Height="50" hc:RelativePanel.Below="{Binding ElementName=Rect7}">
+                    <TextBlock Text="Rect8 (Below Rect7)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect9" Background="{DynamicResource PrimaryBrush}" Height="140" Width="460" hc:RelativePanel.AlignHorizontalCenterWithPanel="True" hc:RelativePanel.AlignVerticalCenterWithPanel="True">
+                    <TextBlock Text="Rect9" Padding="10" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Top"/>
+                </Border>
+                <Border Name="Rect10" Background="{DynamicResource DangerBrush}" Width="50" hc:RelativePanel.RightOf="{Binding ElementName=Rect9}" hc:RelativePanel.AlignVerticalCenterWith="{Binding ElementName=Rect9}">
+                    <TextBlock Text="Rect14 (RightOf Rect9, AlignVerticalCenterWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center">
+                        <TextBlock.LayoutTransform>
+                            <TransformGroup>
+                                <RotateTransform Angle="-90"/>
+                            </TransformGroup>
+                        </TextBlock.LayoutTransform>
+                    </TextBlock>
+                </Border>
+                <Border Name="Rect11" Background="{DynamicResource DangerBrush}" Height="50" hc:RelativePanel.AlignBottomWith="{Binding ElementName=Rect9}" hc:RelativePanel.AlignHorizontalCenterWith="{Binding ElementName=Rect9}">
+                    <TextBlock Text="Rect11 (AlignBottomWith Rect9, AlignHorizontalCenterWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect12" Background="{DynamicResource DangerBrush}" Height="50" hc:RelativePanel.Below="{Binding ElementName=Rect8}" hc:RelativePanel.AlignLeftWith="{Binding ElementName=Rect7}">
+                    <TextBlock Text="Rect12 (Below Rect8, AlignLeftWith Rect7)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect13" Background="{DynamicResource PrimaryBrush}" Height="50" hc:RelativePanel.Below="{Binding ElementName=Rect12}" hc:RelativePanel.AlignRightWith="{Binding ElementName=Rect12}">
+                    <TextBlock Text="Rect13 (Below Rect12, AlignRightWith Rect12)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect14" Background="{DynamicResource SuccessBrush}" Height="50" hc:RelativePanel.Above="{Binding ElementName=Rect9}" hc:RelativePanel.AlignRightWith="{Binding ElementName=Rect9}">
+                    <TextBlock Text="Rect14 (Above Rect9, AlignRightWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+                <Border Name="Rect15" Background="{DynamicResource DangerBrush}" Height="50" hc:RelativePanel.LeftOf="{Binding ElementName=Rect2}" hc:RelativePanel.AlignTopWith="{Binding ElementName=Rect9}">
+                    <TextBlock Text="Rect15 (LeftOf Rect2, AlignTopWith Rect9)" Padding="10,0" Foreground="White" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
+                </Border>
+            </hc:RelativePanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RunningBlockDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RunningBlockDemoCtl.xaml
index 74fc67f7..be53f250 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RunningBlockDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/RunningBlockDemoCtl.xaml
@@ -6,31 +6,33 @@
              xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension">
     <hc:TransitioningContentControl>
-        <StackPanel Margin="32" VerticalAlignment="Center">
-            <hc:RunningBlock Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
-            <hc:RunningBlock Runaway="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
-            <hc:RunningBlock HorizontalAlignment="Left" Width="500" Speed="50" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
-            <hc:RunningBlock HorizontalAlignment="Left" Width="300" FontSize="30" Speed="50" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
-            <hc:RunningBlock HorizontalAlignment="Left" AutoRun="True" Width="100" Runaway="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Duration="0:0:2" Margin="0,16,0,0"/>
-            <hc:RunningBlock HorizontalAlignment="Left" AutoReverse="True" AutoRun="True" Width="100" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
-            <hc:RunningBlock HorizontalAlignment="Left" AutoRun="True" Width="200" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
-            <hc:RunningBlock Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=10}" FontSize="20" FontWeight="Bold" Foreground="OrangeRed" Duration="0:0:10" Margin="0,16,0,0"/>
-            <hc:RunningBlock AutoReverse="True" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=10}" FontSize="20" FontWeight="Bold" Foreground="OrangeRed" Duration="0:0:10" Margin="0,16,0,0"/>
-            <hc:RunningBlock Orientation="Vertical" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=10}" FontSize="20" FontWeight="Bold" Foreground="OrangeRed" Duration="0:0:4" Margin="0,16,0,0"/>
-            <hc:RunningBlock Margin="0,16,0,0" Duration="0:0:20" IsRunning="{Binding IsMouseOver,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2BooleanReConverter}}">
-                <StackPanel Orientation="Horizontal">
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/1.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/2.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/3.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/4.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/5.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/6.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/7.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/8.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/9.gif" Margin="10,0" Width="30" Height="30"/>
-                    <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/10.gif" Margin="10,0" Width="30" Height="30"/>
-                </StackPanel>
-            </hc:RunningBlock>
-        </StackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <StackPanel Margin="32" VerticalAlignment="Center">
+                <hc:RunningBlock Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
+                <hc:RunningBlock Runaway="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
+                <hc:RunningBlock HorizontalAlignment="Left" Width="500" Speed="50" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
+                <hc:RunningBlock HorizontalAlignment="Left" Width="300" FontSize="30" Speed="50" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
+                <hc:RunningBlock HorizontalAlignment="Left" AutoRun="True" Width="100" Runaway="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Duration="0:0:2" Margin="0,16,0,0"/>
+                <hc:RunningBlock HorizontalAlignment="Left" AutoReverse="True" AutoRun="True" Width="100" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
+                <hc:RunningBlock HorizontalAlignment="Left" AutoRun="True" Width="200" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}" Margin="0,16,0,0"/>
+                <hc:RunningBlock Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=10}" FontSize="20" FontWeight="Bold" Foreground="OrangeRed" Duration="0:0:10" Margin="0,16,0,0"/>
+                <hc:RunningBlock AutoReverse="True" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=10}" FontSize="20" FontWeight="Bold" Foreground="OrangeRed" Duration="0:0:10" Margin="0,16,0,0"/>
+                <hc:RunningBlock Orientation="Vertical" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=10}" FontSize="20" FontWeight="Bold" Foreground="OrangeRed" Duration="0:0:4" Margin="0,16,0,0"/>
+                <hc:RunningBlock Margin="0,16,0,0" Duration="0:0:20" IsRunning="{Binding IsMouseOver,RelativeSource={RelativeSource Self},Converter={StaticResource Boolean2BooleanReConverter}}">
+                    <StackPanel Orientation="Horizontal">
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/1.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/2.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/3.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/4.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/5.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/6.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/7.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/8.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/9.gif" Margin="10,0" Width="30" Height="30"/>
+                        <hc:GifImage Uri="/HandyControlDemo;component/Resources/Img/QQ/10.gif" Margin="10,0" Width="30" Height="30"/>
+                    </StackPanel>
+                </hc:RunningBlock>
+            </StackPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ScrollViewerDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ScrollViewerDemoCtl.xaml
index 08918f62..50371526 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ScrollViewerDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/ScrollViewerDemoCtl.xaml
@@ -5,7 +5,7 @@
              xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}"
-             Width="550"
+             MaxWidth="550"
              Height="600">
     <hc:TransitioningContentControl>
         <Grid Margin="32">
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/SearchBarDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/SearchBarDemoCtl.xaml
index 9307a54c..7930304c 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/SearchBarDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/SearchBarDemoCtl.xaml
@@ -7,59 +7,61 @@
              DataContext="{Binding InputElementDemo, Source={StaticResource Locator}}"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
-            <StackPanel>
-                <hc:SearchBar Command="{Binding SearchCmd}" CommandParameter="{Binding Text,RelativeSource={RelativeSource Self}}"/>
-                <hc:SearchBar Margin="0,32,0,0" IsEnabled="False"/>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
+                <StackPanel>
+                    <hc:SearchBar Command="{Binding SearchCmd}" CommandParameter="{Binding Text,RelativeSource={RelativeSource Self}}"/>
+                    <hc:SearchBar Margin="0,32,0,0" IsEnabled="False"/>
 
-                <hc:SearchBar hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarExtend}"/>
-                <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarExtend}"/>
-                <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend}" Margin="0,32,0,0"/>
-                <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:SearchBar hc:InfoElement.ShowClearButton="True" Style="{StaticResource SearchBarPlus}"/>
-                <hc:SearchBar Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource SearchBarPlus}"/>
+                    <hc:SearchBar hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarExtend}"/>
+                    <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarExtend}"/>
+                    <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend}" Margin="0,32,0,0"/>
+                    <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:SearchBar hc:InfoElement.ShowClearButton="True" Style="{StaticResource SearchBarPlus}"/>
+                    <hc:SearchBar Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource SearchBarPlus}"/>
 
-                <hc:SearchBar hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarPlus}"/>
-                <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarPlus}">
-                    <hc:SearchBar.Text>
-                        <Binding Path="Email1" UpdateSourceTrigger="PropertyChanged">
-                            <Binding.ValidationRules>
-                                <hc:RegexRule Type="Mail"/>
-                            </Binding.ValidationRules>
-                        </Binding>
-                    </hc:SearchBar.Text>
-                </hc:SearchBar>
-                <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus}" Margin="0,32,0,0"/>
-                <hc:SearchBar hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:SearchBar Command="{Binding SearchCmd}" CommandParameter="{Binding Text,RelativeSource={RelativeSource Self}}" Style="{StaticResource SearchBar.Small}"/>
-                <hc:SearchBar Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource SearchBar.Small}"/>
+                    <hc:SearchBar hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarPlus}"/>
+                    <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarPlus}">
+                        <hc:SearchBar.Text>
+                            <Binding Path="Email1" UpdateSourceTrigger="PropertyChanged">
+                                <Binding.ValidationRules>
+                                    <hc:RegexRule Type="Mail"/>
+                                </Binding.ValidationRules>
+                            </Binding>
+                        </hc:SearchBar.Text>
+                    </hc:SearchBar>
+                    <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus}" Margin="0,32,0,0"/>
+                    <hc:SearchBar hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:SearchBar Command="{Binding SearchCmd}" CommandParameter="{Binding Text,RelativeSource={RelativeSource Self}}" Style="{StaticResource SearchBar.Small}"/>
+                    <hc:SearchBar Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource SearchBar.Small}"/>
 
-                <hc:SearchBar hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarExtend.Small}"/>
-                <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarExtend.Small}"/>
-                <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend.Small}" Margin="0,32,0,0"/>
-                <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:SearchBar hc:InfoElement.ShowClearButton="True" Style="{StaticResource SearchBarPlus.Small}"/>
-                <hc:SearchBar Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource SearchBarPlus.Small}"/>
+                    <hc:SearchBar hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarExtend.Small}"/>
+                    <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarExtend.Small}"/>
+                    <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend.Small}" Margin="0,32,0,0"/>
+                    <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarExtend.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:SearchBar hc:InfoElement.ShowClearButton="True" Style="{StaticResource SearchBarPlus.Small}"/>
+                    <hc:SearchBar Margin="0,32,0,0" IsEnabled="False" Style="{StaticResource SearchBarPlus.Small}"/>
 
-                <hc:SearchBar hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarPlus.Small}"/>
-                <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarPlus.Small}">
-                    <hc:SearchBar.Text>
-                        <Binding Path="Email1" UpdateSourceTrigger="PropertyChanged">
-                            <Binding.ValidationRules>
-                                <hc:RegexRule Type="Mail"/>
-                            </Binding.ValidationRules>
-                        </Binding>
-                    </hc:SearchBar.Text>
-                </hc:SearchBar>
-                <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus.Small}" Margin="0,32,0,0"/>
-                <hc:SearchBar hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
-            </StackPanel>
-        </hc:UniformSpacingPanel>
+                    <hc:SearchBar hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Style="{StaticResource SearchBarPlus.Small}"/>
+                    <hc:SearchBar hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource SearchBarPlus.Small}">
+                        <hc:SearchBar.Text>
+                            <Binding Path="Email1" UpdateSourceTrigger="PropertyChanged">
+                                <Binding.ValidationRules>
+                                    <hc:RegexRule Type="Mail"/>
+                                </Binding.ValidationRules>
+                            </Binding>
+                        </hc:SearchBar.Text>
+                    </hc:SearchBar>
+                    <hc:SearchBar Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus.Small}" Margin="0,32,0,0"/>
+                    <hc:SearchBar hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource SearchBarPlus.Small}" hc:InfoElement.Necessary="True" Margin="0,32,0,0"/>
+                </StackPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TabControlDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TabControlDemoCtl.xaml
index 98f7378d..78c93a18 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TabControlDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TabControlDemoCtl.xaml
@@ -5,7 +5,7 @@
              DataContext="{Binding TabControlDemo,Source={StaticResource Locator}}"
              xmlns:hc="https://handyorg.github.io/handycontrol">
     <hc:TransitioningContentControl>
-        <hc:ScrollViewer HorizontalScrollBarVisibility="Auto">
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <hc:Interaction.Triggers>
                 <hc:RoutedEventTrigger RoutedEvent="hc:TabItem.Closing">
                     <hc:EventToCommand Command="{Binding ClosingCmd}" PassEventArgsToCommand="True" />
@@ -14,9 +14,13 @@
                     <hc:EventToCommand Command="{Binding ClosedCmd}" PassEventArgsToCommand="True" />
                 </hc:RoutedEventTrigger>
             </hc:Interaction.Triggers>
-            <StackPanel>
-                <Label Style="{StaticResource LabelPrimary}" Content="Default" Margin="32,32,0,0" HorizontalAlignment="Left"/>
-                <hc:TabControl ShowOverflowButton="False" ShowScrollButton="True" Margin="32,16,32,0" Width="800" Height="300" IsScrollable="True">
+            <Grid Margin="32">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="Auto"/>
+                    <RowDefinition Height="Auto"/>
+                    <RowDefinition Height="Auto"/>
+                </Grid.RowDefinitions>
+                <hc:TabControl ShowOverflowButton="False" ShowScrollButton="True" MaxWidth="800" Height="300" IsScrollable="True">
                     <hc:TabItem Header="TabItem1" IsSelected="True">
                         <hc:SimplePanel Background="{DynamicResource RegionBrush}"/>
                     </hc:TabItem>
@@ -39,13 +43,7 @@
                         <hc:SimplePanel Background="{DynamicResource DarkAccentBrush}"/>
                     </hc:TabItem>
                 </hc:TabControl>
-                <StackPanel Orientation="Horizontal" Margin="32,32,32,16">
-                    <Label Style="{StaticResource LabelPrimary}" Margin="0" Content="IsTabFillEnabled = True"/>
-                    <Label Style="{StaticResource LabelPrimary}" Margin="16,0,0,0" Content="ShowCloseButton = True"/>
-                    <Label Style="{StaticResource LabelPrimary}" Margin="16,0,0,0" Content="IsDraggable = True"/>
-                    <Label Style="{StaticResource LabelPrimary}" Margin="16,0,0,0" Content="IsAnimationEnabled = True"/>
-                </StackPanel>
-                <hc:TabControl x:Name="TabControlDemo" IsAnimationEnabled="True" ShowCloseButton="True" IsDraggable="True" IsTabFillEnabled="True" Margin="32,0,32,32" Width="800" Height="300">
+                <hc:TabControl Grid.Row="1" x:Name="TabControlDemo" Margin="0,32,0,0" IsAnimationEnabled="True" ShowCloseButton="True" IsDraggable="True" IsTabFillEnabled="True" MaxWidth="800" Height="300">
                     <hc:TabItem Header="TabItem1" hc:IconElement.Height="16" hc:IconElement.Width="16" hc:IconElement.Geometry="{StaticResource ConfigGeometry}">
                         <hc:SimplePanel Background="{DynamicResource RegionBrush}"/>
                     </hc:TabItem>
@@ -68,7 +66,7 @@
                         <hc:SimplePanel Background="#FFE8E03F"/>
                     </hc:TabItem>
                 </hc:TabControl>
-                <hc:TabControl IsAnimationEnabled="True" ShowCloseButton="True" IsDraggable="True" ItemsSource="{Binding DataList}" Width="800" Height="300">
+                <hc:TabControl Grid.Row="2" IsAnimationEnabled="True" Margin="0,32,0,0" ShowCloseButton="True" IsDraggable="True" ItemsSource="{Binding DataList}" MaxWidth="800" Height="300">
                     <TabControl.ItemTemplate>
                         <DataTemplate>
                             <TextBlock Text="{Binding Header}"/>
@@ -80,7 +78,7 @@
                         </DataTemplate>
                     </TabControl.ContentTemplate>
                 </hc:TabControl>
-            </StackPanel>
+            </Grid>
         </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TagDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TagDemoCtl.xaml
index d1744bb2..4c8b5bf5 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TagDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TagDemoCtl.xaml
@@ -14,32 +14,34 @@
         </Style>
     </UserControl.Resources>
     <hc:TransitioningContentControl>
-        <StackPanel Margin="11">
-            <hc:TagContainer Name="Container1" Margin="11" Width="420" Padding="5">
-                <hc:Tag Header="H" hc:TitleElement.Background="{DynamicResource PrimaryBrush}" Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
-                <hc:Tag Margin="5" Selectable="True" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=3}"/>
-                <hc:Tag Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=4}"/>
-                <hc:Tag Margin="5" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
-                <hc:Tag Margin="5" IsSelected="True" Selectable="True" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=4}"/>
-                <hc:Tag Margin="5" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=3}"/>
-                <hc:Tag Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}">
-                    <hc:Tag.Header>
-                        <Image Source="/Resources/Img/Album/1.jpg"/>
-                    </hc:Tag.Header>
-                </hc:Tag>
-                <hc:Tag Margin="5" IsSelected="True" Selectable="True" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=3}">
-                    <hc:Tag.Header>
-                        <Image Source="/Resources/Img/Avatar/avatar2.png"/>
-                    </hc:Tag.Header>
-                </hc:Tag>
-                <hc:Tag Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=4}"/>
-                <hc:Tag Margin="5" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
-            </hc:TagContainer>
-            <hc:TagContainer ItemContainerStyle="{StaticResource TagCustomStyle}" Margin="11" Width="420" Padding="5" ItemsSource="{Binding DataList}"/>
-            <DockPanel LastChildFill="True" Margin="11,0,11,11">
-                <Button Command="{Binding AddItemCmd}" Margin="10,0,0,0" DockPanel.Dock="Right" Content="{ex:Lang Key={x:Static langs:LangKeys.AddItem}}"/>
-                <TextBox Text="{Binding TagName}"/>
-            </DockPanel>
-        </StackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <StackPanel Margin="11">
+                <hc:TagContainer Name="Container1" Margin="11" MaxWidth="420" Padding="5">
+                    <hc:Tag Header="H" hc:TitleElement.Background="{DynamicResource PrimaryBrush}" Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}"/>
+                    <hc:Tag Margin="5" Selectable="True" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=3}"/>
+                    <hc:Tag Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=4}"/>
+                    <hc:Tag Margin="5" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
+                    <hc:Tag Margin="5" IsSelected="True" Selectable="True" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=4}"/>
+                    <hc:Tag Margin="5" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=3}"/>
+                    <hc:Tag Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=2}">
+                        <hc:Tag.Header>
+                            <Image Source="/Resources/Img/Album/1.jpg"/>
+                        </hc:Tag.Header>
+                    </hc:Tag>
+                    <hc:Tag Margin="5" IsSelected="True" Selectable="True" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=3}">
+                        <hc:Tag.Header>
+                            <Image Source="/Resources/Img/Avatar/avatar2.png"/>
+                        </hc:Tag.Header>
+                    </hc:Tag>
+                    <hc:Tag Margin="5" ShowCloseButton="False" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=4}"/>
+                    <hc:Tag Margin="5" Content="{ex:Lang Key={x:Static langs:LangKeys.Text}, Converter={StaticResource StringRepeatConverter}, ConverterParameter=5}"/>
+                </hc:TagContainer>
+                <hc:TagContainer ItemContainerStyle="{StaticResource TagCustomStyle}" Margin="11" MaxWidth="420" Padding="5" ItemsSource="{Binding DataList}"/>
+                <DockPanel LastChildFill="True" Margin="11,0,11,11">
+                    <Button Command="{Binding AddItemCmd}" Margin="10,0,0,0" DockPanel.Dock="Right" Content="{ex:Lang Key={x:Static langs:LangKeys.AddItem}}"/>
+                    <TextBox Text="{Binding TagName}"/>
+                </DockPanel>
+            </StackPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TextBoxDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TextBoxDemoCtl.xaml
index 7bac1879..c3d97fee 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TextBoxDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TextBoxDemoCtl.xaml
@@ -7,41 +7,43 @@
              xmlns:hc="https://handyorg.github.io/handycontrol"
              DataContext="{Binding InputElementDemo, Source={StaticResource Locator}}">
     <hc:TransitioningContentControl>
-        <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
-            <StackPanel>
-                <hc:TextBox hc:InfoElement.ShowClearButton="True" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <hc:TextBox Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Margin="0,16,0,0" IsEnabled="False"/>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Spacing="32" Margin="32" ChildWrapping="Wrap">
+                <StackPanel>
+                    <hc:TextBox hc:InfoElement.ShowClearButton="True" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <hc:TextBox Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Margin="0,16,0,0" IsEnabled="False"/>
 
-                <hc:TextBox hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <hc:TextBox hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0">
-                    <hc:TextBox.Text>
-                        <Binding Path="Email1" UpdateSourceTrigger="PropertyChanged">
-                            <Binding.ValidationRules>
-                                <hc:RegexRule Type="Mail"/>
-                            </Binding.ValidationRules>
-                        </Binding>
-                    </hc:TextBox.Text>
-                </hc:TextBox>
-                <hc:TextBox Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <hc:TextBox hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0"/>
-            </StackPanel>
-            <StackPanel>
-                <hc:TextBox hc:InfoElement.ShowClearButton="True" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Style="{StaticResource TextBoxPlus.Small}"/>
-                <hc:TextBox Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Margin="0,16,0,0" IsEnabled="False" Style="{StaticResource TextBoxPlus.Small}"/>
+                    <hc:TextBox hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <hc:TextBox hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0">
+                        <hc:TextBox.Text>
+                            <Binding Path="Email1" UpdateSourceTrigger="PropertyChanged">
+                                <Binding.ValidationRules>
+                                    <hc:RegexRule Type="Mail"/>
+                                </Binding.ValidationRules>
+                            </Binding>
+                        </hc:TextBox.Text>
+                    </hc:TextBox>
+                    <hc:TextBox Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <hc:TextBox hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0"/>
+                </StackPanel>
+                <StackPanel>
+                    <hc:TextBox hc:InfoElement.ShowClearButton="True" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Style="{StaticResource TextBoxPlus.Small}"/>
+                    <hc:TextBox Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Margin="0,16,0,0" IsEnabled="False" Style="{StaticResource TextBoxPlus.Small}"/>
 
-                <hc:TextBox hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Style="{StaticResource TextBoxPlus.Small}"/>
-                <hc:TextBox hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0" Style="{StaticResource TextBoxPlus.Small}">
-                    <hc:TextBox.Text>
-                        <Binding Path="Email2" UpdateSourceTrigger="PropertyChanged">
-                            <Binding.ValidationRules>
-                                <hc:RegexRule Type="Mail"/>
-                            </Binding.ValidationRules>
-                        </Binding>
-                    </hc:TextBox.Text>
-                </hc:TextBox>
-                <hc:TextBox Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Style="{StaticResource TextBoxPlus.Small}"/>
-                <hc:TextBox hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0" Style="{StaticResource TextBoxPlus.Small}"/>
-            </StackPanel>
-        </hc:UniformSpacingPanel>
+                    <hc:TextBox hc:InfoElement.ShowClearButton="True" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr1}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Style="{StaticResource TextBoxPlus.Small}"/>
+                    <hc:TextBox hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterEmail}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr2}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0" Style="{StaticResource TextBoxPlus.Small}">
+                        <hc:TextBox.Text>
+                            <Binding Path="Email2" UpdateSourceTrigger="PropertyChanged">
+                                <Binding.ValidationRules>
+                                    <hc:RegexRule Type="Mail"/>
+                                </Binding.ValidationRules>
+                            </Binding>
+                        </hc:TextBox.Text>
+                    </hc:TextBox>
+                    <hc:TextBox Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Margin="0,32,0,0" Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" Style="{StaticResource TextBoxPlus.Small}"/>
+                    <hc:TextBox hc:InfoElement.ShowClearButton="True" Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" hc:InfoElement.Necessary="True" Margin="0,16,0,0" Style="{StaticResource TextBoxPlus.Small}"/>
+                </StackPanel>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TimePickerDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TimePickerDemoCtl.xaml
index 6e054d8e..c430c1f4 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TimePickerDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TimePickerDemoCtl.xaml
@@ -6,7 +6,7 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <ScrollViewer>
+        <hc:ScrollViewer IsInertiaEnabled="True">
             <hc:UniformSpacingPanel  Spacing="32" Margin="32" ChildWrapping="Wrap">
                 <StackPanel>
                     <hc:TimePicker ShowClearButton="True"/>
@@ -57,6 +57,6 @@
                     <hc:TimePicker Width="380" hc:InfoElement.TitleWidth="140" hc:InfoElement.TitlePlacement="Left" hc:InfoElement.Placeholder="{ex:Lang Key={x:Static langs:LangKeys.PlsEnterContent}}" hc:InfoElement.Title="{ex:Lang Key={x:Static langs:LangKeys.TitleDemoStr3}}" Style="{StaticResource TimePickerPlus.Small}" hc:InfoElement.Necessary="True" Margin="0,16,0,0"/>
                 </StackPanel>
             </hc:UniformSpacingPanel>
-        </ScrollViewer>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TransitioningContentControlDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TransitioningContentControlDemoCtl.xaml
index b7d76fec..c20c2c2d 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TransitioningContentControlDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/TransitioningContentControlDemoCtl.xaml
@@ -2,52 +2,52 @@
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:hc="https://handyorg.github.io/handycontrol"
-             Background="{DynamicResource RegionBrush}"
-             Width="720"
-             Height="500">
-    <Grid Margin="32">
+             Background="{DynamicResource RegionBrush}">
+    <Grid>
         <Grid.RowDefinitions>
             <RowDefinition Height="Auto"/>
             <RowDefinition/>
         </Grid.RowDefinitions>
-        <ToggleButton Margin="0,0,0,32" IsChecked="True" Name="ButtonVisibilitySwitch" Style="{StaticResource ToggleButtonSwitch}"/>
-        <UniformGrid Visibility="{Binding IsChecked,ElementName=ButtonVisibilitySwitch,Converter={StaticResource Boolean2VisibilityConverter}}" Grid.Row="1" Rows="4" Columns="3">
-            <hc:TransitioningContentControl>
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Right2Left}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Left2Right">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Left2Right}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Bottom2Top">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Bottom2Top}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Top2Bottom">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Top2Bottom}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Right2LeftWithFade">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Right2LeftWithFade}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Left2RightWithFade">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Left2RightWithFade}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Bottom2TopWithFade">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Bottom2TopWithFade}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Top2BottomWithFade">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Top2BottomWithFade}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionMode="Right2LeftWithFade">
-                <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Right2LeftWithFade}" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionStoryboard="{StaticResource Custom1Transition}">
-                <Label HorizontalAlignment="Stretch" Content="Custom1" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionStoryboard="{StaticResource Custom2Transition}">
-                <Label HorizontalAlignment="Stretch" Content="Custom2" Margin="32"/>
-            </hc:TransitioningContentControl>
-            <hc:TransitioningContentControl TransitionStoryboard="{StaticResource Custom3Transition}">
-                <Label HorizontalAlignment="Stretch" Content="Custom3" Margin="32"/>
-            </hc:TransitioningContentControl>
-        </UniformGrid>
+        <ToggleButton Margin="0,32,0,0" IsChecked="True" Name="ButtonVisibilitySwitch" Style="{StaticResource ToggleButtonSwitch}"/>
+        <hc:ScrollViewer IsInertiaEnabled="True" Grid.Row="1">
+            <hc:UniformSpacingPanel Visibility="{Binding IsChecked,ElementName=ButtonVisibilitySwitch,Converter={StaticResource Boolean2VisibilityConverter}}" MaxWidth="720" Margin="32" Spacing="32" ChildWrapping="Wrap">
+                <hc:TransitioningContentControl>
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Right2Left}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Left2Right">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Left2Right}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Bottom2Top">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Bottom2Top}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Top2Bottom">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Top2Bottom}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Right2LeftWithFade">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Right2LeftWithFade}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Left2RightWithFade">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Left2RightWithFade}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Bottom2TopWithFade">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Bottom2TopWithFade}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Top2BottomWithFade">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Top2BottomWithFade}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionMode="Right2LeftWithFade">
+                    <Label HorizontalAlignment="Stretch" Content="{x:Static hc:TransitionMode.Right2LeftWithFade}"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionStoryboard="{StaticResource Custom1Transition}">
+                    <Label HorizontalAlignment="Stretch" Content="Custom1"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionStoryboard="{StaticResource Custom2Transition}">
+                    <Label HorizontalAlignment="Stretch" Content="Custom2"/>
+                </hc:TransitioningContentControl>
+                <hc:TransitioningContentControl TransitionStoryboard="{StaticResource Custom3Transition}">
+                    <Label HorizontalAlignment="Stretch" Content="Custom3"/>
+                </hc:TransitioningContentControl>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </Grid>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/UniformSpacingPanelDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/UniformSpacingPanelDemoCtl.xaml
index 6287df75..28f53324 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/UniformSpacingPanelDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/UniformSpacingPanelDemoCtl.xaml
@@ -6,34 +6,36 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <hc:SimpleStackPanel Margin="32">
-            <hc:UniformSpacingPanel Spacing="10">
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-            </hc:UniformSpacingPanel>
-            <hc:Divider LineStrokeDashArray="2,2"/>
-            <hc:UniformSpacingPanel Spacing="10" Orientation="Vertical">
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-            </hc:UniformSpacingPanel>
-            <hc:Divider LineStrokeDashArray="2,2"/>
-            <hc:UniformSpacingPanel Spacing="10" Width="300" ChildWrapping="Wrap" HorizontalAlignment="Left">
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-            </hc:UniformSpacingPanel>
-            <hc:Divider LineStrokeDashArray="2,2"/>
-            <hc:UniformSpacingPanel Spacing="10" Orientation="Vertical" Height="70" ChildWrapping="Wrap" HorizontalAlignment="Left">
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-                <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
-            </hc:UniformSpacingPanel>
-        </hc:SimpleStackPanel>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:SimpleStackPanel Margin="32">
+                <hc:UniformSpacingPanel Spacing="10">
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                </hc:UniformSpacingPanel>
+                <hc:Divider LineStrokeDashArray="2,2"/>
+                <hc:UniformSpacingPanel Spacing="10" Orientation="Vertical">
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                </hc:UniformSpacingPanel>
+                <hc:Divider LineStrokeDashArray="2,2"/>
+                <hc:UniformSpacingPanel Spacing="10" Width="300" ChildWrapping="Wrap" HorizontalAlignment="Left">
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                </hc:UniformSpacingPanel>
+                <hc:Divider LineStrokeDashArray="2,2"/>
+                <hc:UniformSpacingPanel Spacing="10" Orientation="Vertical" Height="70" ChildWrapping="Wrap" HorizontalAlignment="Left">
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                    <Button Content="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}"/>
+                </hc:UniformSpacingPanel>
+            </hc:SimpleStackPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WaterfallPanelDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WaterfallPanelDemoCtl.xaml
index 37218e9a..4e1a662c 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WaterfallPanelDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WaterfallPanelDemoCtl.xaml
@@ -12,7 +12,7 @@
                 <RowDefinition/>
             </Grid.RowDefinitions>
             <hc:NumericUpDown x:Name="UpDownGroups" HorizontalAlignment="Center" Value="2" Minimum="1" Maximum="3" Width="200" Style="{StaticResource NumericUpDownExtend}" hc:TitleElement.Title="{ex:Lang Key={x:Static langs:LangKeys.Groups}}" hc:TitleElement.TitleWidth="50" hc:TitleElement.TitlePlacement="Left"/>
-            <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="0,16,0,0">
+            <hc:UniformSpacingPanel Grid.Row="1" Spacing="16" ChildWrapping="Wrap" Margin="0,16,0,0">
                 <hc:ScrollViewer MaxHeight="300">
                     <hc:WaterfallPanel VerticalAlignment="Center" Width="300" Groups="{Binding Value,ElementName=UpDownGroups}" hc:PanelElement.FluidMoveBehavior="{StaticResource BehaviorXY200}">
                         <Border Height="100" Background="{DynamicResource PrimaryBrush}" Effect="{StaticResource EffectShadow1}" Margin="5">
@@ -32,7 +32,7 @@
                         </Border>
                     </hc:WaterfallPanel>
                 </hc:ScrollViewer>
-                <hc:ScrollViewer Margin="32,0,0,0" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Hidden" hc:ScrollViewerAttach.Orientation="Horizontal" MaxWidth="300">
+                <hc:ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Hidden" hc:ScrollViewerAttach.Orientation="Horizontal" MaxWidth="300">
                     <hc:WaterfallPanel VerticalAlignment="Center" Height="300" Orientation="Vertical" Groups="{Binding Value,ElementName=UpDownGroups}" hc:PanelElement.FluidMoveBehavior="{StaticResource BehaviorXY200}">
                         <Border Width="100" Background="{DynamicResource PrimaryBrush}" Effect="{StaticResource EffectShadow1}" Margin="5">
                             <TextBlock Text="{ex:Lang Key={x:Static langs:LangKeys.ContentDemoStr}}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
@@ -51,7 +51,7 @@
                         </Border>
                     </hc:WaterfallPanel>
                 </hc:ScrollViewer>
-            </StackPanel>
+            </hc:UniformSpacingPanel>
         </Grid>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WindowDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WindowDemoCtl.xaml
index cbbe9643..7ec91422 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WindowDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/WindowDemoCtl.xaml
@@ -8,16 +8,18 @@
              DataContext="{Binding WindowDemo,Source={StaticResource Locator}}"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <UniformGrid Margin="32" Columns="3" Rows="3" Height="200">
-            <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.CommonWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCommonWindow}}"/>
-            <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.BlurWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenBlurWindow}}"/>
-            <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.CustomNonClientAreaWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCustomNonClientAreaWindow}}"/>
-            <Button Click="ButtonMessage_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenMessageWindow}}"/>
-            <Button Click="ButtonCustomMessage_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCustomMessageWindow}}"/>
-            <Button Click="ButtonCustomContent_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCustomContentWindow}}"/>
-            <Button Name="ButtonMouseFollow" Click="ButtonMouseFollow_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenMouseFollowWindow}}"/>
-            <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.NoNonClientAreaDragableWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenNoNonClientAreaDragableWindow}}"/>
-            <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.GlowWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenGlowWindow}}"/>
-        </UniformGrid>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" ChildWrapping="Wrap" Spacing="16" VerticalAlignment="Center" MaxWidth="500">
+                <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.CommonWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCommonWindow}}"/>
+                <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.BlurWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenBlurWindow}}"/>
+                <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.CustomNonClientAreaWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCustomNonClientAreaWindow}}"/>
+                <Button Click="ButtonMessage_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenMessageWindow}}"/>
+                <Button Click="ButtonCustomMessage_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCustomMessageWindow}}"/>
+                <Button Click="ButtonCustomContent_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenCustomContentWindow}}"/>
+                <Button Name="ButtonMouseFollow" Click="ButtonMouseFollow_OnClick" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenMouseFollowWindow}}"/>
+                <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.NoNonClientAreaDragableWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenNoNonClientAreaDragableWindow}}"/>
+                <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.GlowWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenGlowWindow}}"/>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeScrollViewerDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeScrollViewerDemoCtl.xaml
index b0447226..f98cd9d2 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeScrollViewerDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeScrollViewerDemoCtl.xaml
@@ -5,7 +5,7 @@
              xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}" 
-             Width="550"
+             MaxWidth="550"
              Height="600">
     <hc:TransitioningContentControl>
         <Grid Margin="32">
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeWindowDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeWindowDemoCtl.xaml
index e7fd28b5..1caacbaa 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeWindowDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Styles/NativeWindowDemoCtl.xaml
@@ -8,10 +8,10 @@
              xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <UniformGrid Margin="32" Columns="3" Rows="3" Height="200">
+        <hc:UniformSpacingPanel Margin="32" Spacing="16" ChildWrapping="Wrap" VerticalAlignment="Center">
             <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.NativeCommonWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenNativeCommonWindow}}"/>
             <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.NavigationWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenNavigationWindow}}"/>
             <Button Command="{Binding OpenWindowCmd}" CommandParameter="{x:Static data:MessageToken.TouchDragMoveWindow}" Content="{ex:Lang Key={x:Static langs:LangKeys.OpenTouchDragMoveWindow}}"/>
-        </UniformGrid>
+        </hc:UniformSpacingPanel>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Styles/TextBlockDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Styles/TextBlockDemoCtl.xaml
index 2d652f2d..4f9c7d37 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Styles/TextBlockDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Styles/TextBlockDemoCtl.xaml
@@ -2,49 +2,28 @@
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:hc="https://handyorg.github.io/handycontrol"
-             xmlns:langs="clr-namespace:HandyControlDemo.Properties.Langs"
-             xmlns:ex="clr-namespace:HandyControlDemo.Tools.Extension"
              Background="{DynamicResource RegionBrush}">
     <hc:TransitioningContentControl>
-        <StackPanel Margin="32" Orientation="Horizontal">
-            <StackPanel>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockLargeBold" Style="{StaticResource TextBlockLargeBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockLarge" Style="{StaticResource TextBlockLarge}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockHeaderBold" Style="{StaticResource TextBlockTitleBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockHeader" Style="{StaticResource TextBlockTitle}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockSubHeaderBold" Style="{StaticResource TextBlockSubTitleBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockSubHeader" Style="{StaticResource TextBlockSubTitle}"/>
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <hc:UniformSpacingPanel Margin="32" Spacing="5" Orientation="Vertical">
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockLargeBold" Style="{StaticResource TextBlockLargeBold}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockLarge" Style="{StaticResource TextBlockLarge}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockHeaderBold" Style="{StaticResource TextBlockTitleBold}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockHeader" Style="{StaticResource TextBlockTitle}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockSubHeaderBold" Style="{StaticResource TextBlockSubTitleBold}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockSubHeader" Style="{StaticResource TextBlockSubTitle}"/>
 
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultBold" Style="{StaticResource TextBlockDefaultBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefault" Style="{StaticResource TextBlockDefault}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultAccent" Style="{StaticResource TextBlockDefaultAccent}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultSecLight" Style="{StaticResource TextBlockDefaultSecLight}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultThiLight" Style="{StaticResource TextBlockDefaultThiLight}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultPrimary" Style="{StaticResource TextBlockDefaultPrimary}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultDanger" Style="{StaticResource TextBlockDefaultDanger}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultWarning" Style="{StaticResource TextBlockDefaultWarning}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultInfo" Style="{StaticResource TextBlockDefaultInfo}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="TextBlockDefaultSuccess" Style="{StaticResource TextBlockDefaultSuccess}"/>
-            </StackPanel>
-            <StackPanel Margin="10,0,0,0">
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Title},Converter={StaticResource StringRepeatConverter},ConverterParameter=10}" Style="{StaticResource TextBlockLargeBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Title},Converter={StaticResource StringRepeatConverter},ConverterParameter=10}" Style="{StaticResource TextBlockLarge}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Title},Converter={StaticResource StringRepeatConverter},ConverterParameter=12}" Style="{StaticResource TextBlockTitleBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Title},Converter={StaticResource StringRepeatConverter},ConverterParameter=12}" Style="{StaticResource TextBlockTitle}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.SubTitle},Converter={StaticResource StringRepeatConverter},ConverterParameter=10}" Style="{StaticResource TextBlockSubTitleBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.SubTitle},Converter={StaticResource StringRepeatConverter},ConverterParameter=10}" Style="{StaticResource TextBlockSubTitle}"/>
-
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultBold}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefault}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultAccent}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultSecLight}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultThiLight}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultPrimary}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultDanger}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultWarning}"/>
-                <TextBlock HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultInfo}"/>
-                <TextBlock hc:TextBlockAttach.AutoTooltip="True" TextTrimming="CharacterEllipsis" Width="300" HorizontalAlignment="Left" Margin="5" Text="{ex:Lang Key={x:Static langs:LangKeys.Text},Converter={StaticResource StringRepeatConverter},ConverterParameter=20}" Style="{StaticResource TextBlockDefaultSuccess}"/>
-            </StackPanel>
-        </StackPanel>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultBold" Style="{StaticResource TextBlockDefaultBold}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefault" Style="{StaticResource TextBlockDefault}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultAccent" Style="{StaticResource TextBlockDefaultAccent}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultSecLight" Style="{StaticResource TextBlockDefaultSecLight}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultThiLight" Style="{StaticResource TextBlockDefaultThiLight}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultPrimary" Style="{StaticResource TextBlockDefaultPrimary}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultDanger" Style="{StaticResource TextBlockDefaultDanger}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultWarning" Style="{StaticResource TextBlockDefaultWarning}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultInfo" Style="{StaticResource TextBlockDefaultInfo}"/>
+                <TextBlock HorizontalAlignment="Left" Text="TextBlockDefaultSuccess" Style="{StaticResource TextBlockDefaultSuccess}"/>
+            </hc:UniformSpacingPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Tools/EffectsDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Tools/EffectsDemoCtl.xaml
index 649aef85..01cbdd34 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Tools/EffectsDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Tools/EffectsDemoCtl.xaml
@@ -25,67 +25,69 @@
         </EventTrigger>
     </UserControl.Triggers>
     <hc:TransitioningContentControl>
-        <StackPanel Margin="32">
-            <UniformGrid Margin="16" Columns="3">
-                <Image Margin="16" Width="120" Height="120" Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg"/>
-                <Image Width="120" Height="120" Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
-                    <Image.Effect>
-                        <hc:ColorComplementEffect/>
-                    </Image.Effect>
-                </Image>
-                <Image Width="120" Height="120" Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
-                    <Image.Effect>
-                        <hc:GrayScaleEffect/>
-                    </Image.Effect>
-                </Image>
-                <Image Width="120" Height="120" Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
-                    <Image.Effect>
-                        <hc:GrayScaleEffect Scale=".7"/>
-                    </Image.Effect>
-                </Image>
-                <Image Width="120" Height="120" Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
-                    <Image.Effect>
-                        <hc:ColorMatrixEffect M11="-1" M22="-1" M33="-1" M41="1" M42="1" M43="1" M44="1" M51="1"/>
-                    </Image.Effect>
-                </Image>
-                <Image Width="120" Height="120" Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
-                    <Image.Effect>
-                        <hc:ColorMatrixEffect M11="1.5" M21="1.5" M31="1.5" M12="1.5" M22="1.5" M32="1.5" M13="1.5" M23="1.5" M33="1.5" M51="-1" M52="-1" M53="-1"/>
-                    </Image.Effect>
-                </Image>
-            </UniformGrid>
-            <hc:BlendEffectBox>
-                <hc:BlendEffectBox.Effects>
-                    <BlurEffect Radius="30"/>
-                    <hc:BrightnessEffect Brightness="1"/>
-                    <hc:ContrastEffect Contrast="20"/>
-                </hc:BlendEffectBox.Effects>
-                <StackPanel>
-                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
-                        <Border Width="100" Height="100" Background="Red" RenderTransformOrigin="0.5,0.5">
+        <hc:ScrollViewer IsInertiaEnabled="True">
+            <StackPanel Margin="32">
+                <hc:UniformSpacingPanel Margin="16" Spacing="16" ItemWidth="120" ItemHeight="120" ChildWrapping="Wrap" MaxWidth="392" HorizontalAlignment="Center">
+                    <Image Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg"/>
+                    <Image Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
+                        <Image.Effect>
+                            <hc:ColorComplementEffect/>
+                        </Image.Effect>
+                    </Image>
+                    <Image Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
+                        <Image.Effect>
+                            <hc:GrayScaleEffect/>
+                        </Image.Effect>
+                    </Image>
+                    <Image Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
+                        <Image.Effect>
+                            <hc:GrayScaleEffect Scale=".7"/>
+                        </Image.Effect>
+                    </Image>
+                    <Image Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
+                        <Image.Effect>
+                            <hc:ColorMatrixEffect M11="-1" M22="-1" M33="-1" M41="1" M42="1" M43="1" M44="1" M51="1"/>
+                        </Image.Effect>
+                    </Image>
+                    <Image Source="/HandyControlDemo;component/Resources/Img/Album/10.jpg">
+                        <Image.Effect>
+                            <hc:ColorMatrixEffect M11="1.5" M21="1.5" M31="1.5" M12="1.5" M22="1.5" M32="1.5" M13="1.5" M23="1.5" M33="1.5" M51="-1" M52="-1" M53="-1"/>
+                        </Image.Effect>
+                    </Image>
+                </hc:UniformSpacingPanel>
+                <hc:BlendEffectBox Margin="0,16,0,0">
+                    <hc:BlendEffectBox.Effects>
+                        <BlurEffect Radius="30"/>
+                        <hc:BrightnessEffect Brightness="1"/>
+                        <hc:ContrastEffect Contrast="20"/>
+                    </hc:BlendEffectBox.Effects>
+                    <StackPanel>
+                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
+                            <Border Width="100" Height="100" Background="Red" RenderTransformOrigin="0.5,0.5">
+                                <Border.RenderTransform>
+                                    <TransformGroup>
+                                        <RotateTransform Angle="0" x:Name="TransformRotate1"/>
+                                    </TransformGroup>
+                                </Border.RenderTransform>
+                            </Border>
+                            <Border Margin="30,0,0,0" Width="100" Height="100" Background="Red" RenderTransformOrigin="0.5,0.5">
+                                <Border.RenderTransform>
+                                    <TransformGroup>
+                                        <RotateTransform Angle="0" x:Name="TransformRotate2"/>
+                                    </TransformGroup>
+                                </Border.RenderTransform>
+                            </Border>
+                        </StackPanel>
+                        <Border Width="100" Height="100" Background="Red" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5">
                             <Border.RenderTransform>
                                 <TransformGroup>
-                                    <RotateTransform Angle="0" x:Name="TransformRotate1"/>
-                                </TransformGroup>
-                            </Border.RenderTransform>
-                        </Border>
-                        <Border Margin="30,0,0,0" Width="100" Height="100" Background="Red" RenderTransformOrigin="0.5,0.5">
-                            <Border.RenderTransform>
-                                <TransformGroup>
-                                    <RotateTransform Angle="0" x:Name="TransformRotate2"/>
+                                    <RotateTransform Angle="0" x:Name="TransformRotate3"/>
                                 </TransformGroup>
                             </Border.RenderTransform>
                         </Border>
                     </StackPanel>
-                    <Border Width="100" Height="100" Background="Red" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5">
-                        <Border.RenderTransform>
-                            <TransformGroup>
-                                <RotateTransform Angle="0" x:Name="TransformRotate3"/>
-                            </TransformGroup>
-                        </Border.RenderTransform>
-                    </Border>
-                </StackPanel>
-            </hc:BlendEffectBox>
-        </StackPanel>
+                </hc:BlendEffectBox>
+            </StackPanel>
+        </hc:ScrollViewer>
     </hc:TransitioningContentControl>
 </UserControl>
diff --git a/src/Shared/HandyControl_Shared/Themes/Styles/Base/RadioButtonBaseStyle.xaml b/src/Shared/HandyControl_Shared/Themes/Styles/Base/RadioButtonBaseStyle.xaml
index f36589ba..a48202ef 100644
--- a/src/Shared/HandyControl_Shared/Themes/Styles/Base/RadioButtonBaseStyle.xaml
+++ b/src/Shared/HandyControl_Shared/Themes/Styles/Base/RadioButtonBaseStyle.xaml
@@ -148,6 +148,7 @@
     <Style x:Key="RadioButtonIconBaseStyle" BasedOn="{StaticResource ButtonBaseBaseStyle}" TargetType="RadioButton">
         <Setter Property="BorderThickness" Value="1"/>
         <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisualRadius0}"/>
+        <Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}"/>
         <Setter Property="Background" Value="{DynamicResource RegionBrush}"/>
         <Setter Property="hc:BorderElement.CornerRadius" Value="0"/>
         <Setter Property="hc:VisualElement.HighlightBrush" Value="{DynamicResource PrimaryBrush}"/>
diff --git a/src/Shared/HandyControl_Shared/Themes/Theme.xaml b/src/Shared/HandyControl_Shared/Themes/Theme.xaml
index c804dea8..8c7f90ca 100644
--- a/src/Shared/HandyControl_Shared/Themes/Theme.xaml
+++ b/src/Shared/HandyControl_Shared/Themes/Theme.xaml
@@ -3015,6 +3015,7 @@
 	<Style x:Key="RadioButtonIconBaseStyle" BasedOn="{StaticResource ButtonBaseBaseStyle}" TargetType="RadioButton">
 		<Setter Property="BorderThickness" Value="1" />
 		<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisualRadius0}" />
+		<Setter Property="Foreground" Value="{DynamicResource PrimaryTextBrush}" />
 		<Setter Property="Background" Value="{DynamicResource RegionBrush}" />
 		<Setter Property="hc:BorderElement.CornerRadius" Value="0" />
 		<Setter Property="hc:VisualElement.HighlightBrush" Value="{DynamicResource PrimaryBrush}" />