diff --git a/doc/source/handycontrol/attach/tipElement/index.md b/doc/source/handycontrol/attach/tipElement/index.md
index ca12ad62..6b91f48d 100644
--- a/doc/source/handycontrol/attach/tipElement/index.md
+++ b/doc/source/handycontrol/attach/tipElement/index.md
@@ -1,5 +1,42 @@
 ---
-title: 建设中
+title: TipElement 提示元素
 ---
 
-建设中
\ No newline at end of file
+# 属性
+
+| 名称       | 用途     |
+| ---------- | -------- |
+| Placement | 提示元素显示位置 |
+| Visibility | 是否可见 |
+
+
+# 使用案例
+
+## Placement 提示元素显示位置
+
+该属性，用于设定提示元素显示位置，目前支持BottomRight和TopLeft（默认值）
+
+```
+<hc:RangeSlider Width="400" 
+                    hc:TipElement.Visibility="Visible" 
+                    TickPlacement="BottomRight" 
+                    IsSnapToTickEnabled="True" 
+                    Maximum="100" ValueEnd="60" 
+                    TickFrequency="10" 
+                    Margin="0,32,0,0"/>
+    <hc:RangeSlider Width="400" 
+                    hc:TipElement.Visibility="Visible"
+                    hc:TipElement.Placement="BottomRight"
+                    TickPlacement="BottomRight" 
+                    IsSnapToTickEnabled="True" 
+                    Maximum="100" ValueEnd="60" 
+                    TickFrequency="10" 
+                    Margin="0,32,0,0"/>
+```
+
+效果
+
+![TipElement.Default](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/TipElement.Default.png)
+
+![TipElement.TopLeft](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/TipElement.TopLeft.png)
+
diff --git a/doc/source/handycontrol/native_controls/border/index.md b/doc/source/handycontrol/native_controls/border/index.md
index 87ddb03a..e3551636 100644
--- a/doc/source/handycontrol/native_controls/border/index.md
+++ b/doc/source/handycontrol/native_controls/border/index.md
@@ -12,32 +12,32 @@ title: Border 边框
 
 ``` xml
         <UniformGrid Margin="32,32,0,0" Columns="3" Rows="2">
-            <Border Style="{StaticResource BorderRegionStyle}" Width="200" Height="200" Margin="0,0,32,32">
+            <Border Style="{StaticResource BorderRegion}" Width="200" Height="200" Margin="0,0,32,32">
                 <Border Background="{DynamicResource PrimaryBrush}">
                     <TextBlock Text="{x:Static langs:Lang.ContentDemoStr}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
                 </Border>
             </Border>
-            <Border Style="{StaticResource BorderRegionStyle}" Width="200" Height="200" Margin="0,0,32,32" Effect="{StaticResource EffectShadow1}">
+            <Border Style="{StaticResource BorderRegion}" Width="200" Height="200" Margin="0,0,32,32" Effect="{StaticResource EffectShadow1}">
                 <Border Background="{DynamicResource InfoBrush}">
                     <TextBlock Text="{x:Static langs:Lang.ContentDemoStr}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
                 </Border>
             </Border>
-            <Border Style="{StaticResource BorderRegionStyle}" Width="200" Height="200" Margin="0,0,32,32" Effect="{StaticResource EffectShadow2}">
+            <Border Style="{StaticResource BorderRegion}" Width="200" Height="200" Margin="0,0,32,32" Effect="{StaticResource EffectShadow2}">
                 <Border Background="{DynamicResource WarningBrush}">
                     <TextBlock Text="{x:Static langs:Lang.ContentDemoStr}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
                 </Border>
             </Border>
-            <Border Style="{StaticResource BorderRegionStyle}" Width="200" Height="200"  Margin="0,0,32,32" Effect="{StaticResource EffectShadow3}">
+            <Border Style="{StaticResource BorderRegion}" Width="200" Height="200"  Margin="0,0,32,32" Effect="{StaticResource EffectShadow3}">
                 <Border Background="{DynamicResource DangerBrush}">
                     <TextBlock Text="{x:Static langs:Lang.ContentDemoStr}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
                 </Border>
             </Border>
-            <Border Style="{StaticResource BorderRegionStyle}" Width="200" Height="200"  Margin="0,0,32,32" Effect="{StaticResource EffectShadow4}">
+            <Border Style="{StaticResource BorderRegion}" Width="200" Height="200"  Margin="0,0,32,32" Effect="{StaticResource EffectShadow4}">
                 <Border Background="{DynamicResource AccentBrush}">
                     <TextBlock Text="{x:Static langs:Lang.ContentDemoStr}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/>
                 </Border>
             </Border>
-            <Border Style="{StaticResource BorderRegionStyle}" Width="200" Height="200"  Margin="0,0,32,32" Effect="{StaticResource EffectShadow5}">
+            <Border Style="{StaticResource BorderRegion}" Width="200" Height="200"  Margin="0,0,32,32" Effect="{StaticResource EffectShadow5}">
                 <Border Background="{DynamicResource BorderBrush}">
                     <TextBlock Text="{x:Static langs:Lang.ContentDemoStr}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                 </Border>
@@ -45,6 +45,8 @@ title: Border 边框
         </UniformGrid>
 ```
 
+提示：新版本中使用的`BorderRegion`，有别于老版本使用样式`BorderRegionStyle`，由直角变更为圆角
+
 # BorderVerticallySplitter
 
 此样式使用1单位宽度的Border来分割横向排列的控件。
diff --git a/doc/source/handycontrol/native_controls/image/index.md b/doc/source/handycontrol/native_controls/image/index.md
index ca12ad62..85764b53 100644
--- a/doc/source/handycontrol/native_controls/image/index.md
+++ b/doc/source/handycontrol/native_controls/image/index.md
@@ -1,5 +1,18 @@
 ---
-title: 建设中
+title: Image图片
 ---
 
-建设中
\ No newline at end of file
+在`HandyControl`中，对应原生的`Image`控件，仅仅提供了一个默认的控件样式，并未提供特殊样式，对于个性化定制，需要使用者自行定制。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <StackPanel Background="LightGray">
+        <Image Source="Resources/Images/Image_basestyle.png" Margin="0,10"></Image>
+        <Image Source="Resources/Images/Image_basestyle.png" RenderOptions.BitmapScalingMode="HighQuality" Stretch="Uniform"></Image>
+    </StackPanel>
+{% endcode %}
+
+![image.baseStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/image.baseStyle.png)
+
+{% endnote %}
\ No newline at end of file
diff --git a/doc/source/handycontrol/native_controls/label/index.md b/doc/source/handycontrol/native_controls/label/index.md
index ca12ad62..cbd200ed 100644
--- a/doc/source/handycontrol/native_controls/label/index.md
+++ b/doc/source/handycontrol/native_controls/label/index.md
@@ -1,5 +1,87 @@
 ---
-title: 建设中
+title: Lable标签
 ---
 
-建设中
\ No newline at end of file
+# LabelBaseStyle
+
+Label标签默认样式，不推荐直接使用，应该始终被其它样式以BasedOn的方式使用。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Label Content="Label默认样式" Margin="10"></Label>
+{% endcode %}
+
+![Label.BaseStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/Label.BaseStyle.png)
+
+{% endnote %}
+
+# LabelPrimary : LabelBaseStyle
+
+主样式
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Label Content="LabelPrimary样式" Margin="10" Style="{DynamicResource LabelPrimary}"></Label>
+{% endcode %}
+
+![Label.PrimaryStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/Label.PrimaryStyle.png)
+
+{% endnote %}
+
+# LabelSuccess : LabelBaseStyle
+
+成功类型样式
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Label Content="LabelSuccess样式" Margin="10" Style="{DynamicResource LabelSuccess}"></Label>
+{% endcode %}
+
+![Label.SuccessStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/Label.SuccessStyle.png)
+
+{% endnote %}
+
+# LabelInfo : LabelBaseStyle
+
+信息类型样式
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Label Content="LabelInfo样式" Margin="10" Style="{DynamicResource LabelInfo}"></Label>
+{% endcode %}
+
+![Label.InfoStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/Label.InfoStyle.png)
+
+{% endnote %}
+
+# LabelWarning : LabelBaseStyle
+
+警告类型样式
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Label Content="LabelWarning样式" Margin="10" Style="{DynamicResource LabelWarning}"></Label>
+{% endcode %}
+
+![Label.WarningStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/Label.WarningStyle.png)
+
+{% endnote %}
+
+# LabelDanger : LabelBaseStyle
+
+危险类型样式
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Label Content="LabelDanger样式" Margin="10" Style="{DynamicResource LabelDanger}"></Label>
+{% endcode %}
+
+![Label.DangerStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/Label.DangerStyle.png)
+
+{% endnote %}
\ No newline at end of file
diff --git a/doc/source/handycontrol/native_controls/listBox/index.md b/doc/source/handycontrol/native_controls/listBox/index.md
index ca12ad62..29de370d 100644
--- a/doc/source/handycontrol/native_controls/listBox/index.md
+++ b/doc/source/handycontrol/native_controls/listBox/index.md
@@ -1,5 +1,147 @@
 ---
-title: 建设中
+title: ListBox 列表框
 ---
 
-建设中
\ No newline at end of file
+#  ListBoxBaseStyle
+
+ ListBox默认样式，不推荐直接使用，应该始终被其它样式以BasedOn的方式使用。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Style BasedOn="{StaticResource ListBoxBaseStyle}" TargetType="ListBox"/>
+{% endcode %}
+
+![ListBox.BaseStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ListBox.BaseStyle.png)
+
+{% endnote %}
+
+#  ListBoxCustom : ListBoxBaseStyle
+
+ListBox列表Custom样式，该样式保留了Listbox的基本属性样式，而数据显示样式由当前用户自定义，实现个性化定制。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <ListBox Margin="10" ItemsSource="{Binding Datas}"  
+             Style="{DynamicResource ListBoxCustom}">
+        <ListBox.ItemTemplate>
+            <DataTemplate>
+                <Border BorderThickness="1" BorderBrush="Black" Margin="0,5">
+                    <DockPanel LastChildFill="True">
+                        <Path DockPanel.Dock="Left" Fill="YellowGreen" Width="20" Margin="10,0,10,0" HorizontalAlignment="Center" Data="{DynamicResource BubbleTailGeometry}"></Path>
+                        <TextBlock Padding="10" Text="{Binding Name}"></TextBlock>
+                    </DockPanel>
+                </Border>
+            </DataTemplate>
+        </ListBox.ItemTemplate>
+    </ListBox>
+{% endcode %}
+
+![ListBox.CustomStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ListBox.CustomStyle.png)
+
+{% endnote %}
+
+#  WrapPanelHorizontalListBox : ListBoxCustom
+
+布局容器为WrapPanel，水平方向显示样式。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <ListBox Margin="10" ItemsSource="{Binding Datas}"  
+             Style="{DynamicResource WrapPanelHorizontalListBox}">
+        <ListBox.ItemTemplate>
+            <DataTemplate>
+                <Border BorderThickness="1" BorderBrush="Black" Margin="5,0">
+                    <DockPanel LastChildFill="True">
+                        <Path DockPanel.Dock="Left" Fill="YellowGreen" Width="20" Margin="10,0,10,0" HorizontalAlignment="Center" Data="{DynamicResource BubbleTailGeometry}"></Path>
+                        <TextBlock Padding="10" Text="{Binding Name}"></TextBlock>
+                    </DockPanel>
+                </Border>
+            </DataTemplate>
+        </ListBox.ItemTemplate>
+    </ListBox>
+{% endcode %}
+
+![ListBox.WrapPanelHorizontalStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ListBox.WrapPanelHorizontalStyle.png)
+
+{% endnote %}
+
+#  WrapPanelVerticalListBox : ListBoxCustom
+
+布局容器为WrapPanel，垂直方向显示样式。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <ListBox Margin="10" ItemsSource="{Binding Datas}"  
+             Style="{DynamicResource WrapPanelVerticalListBox}">
+        <ListBox.ItemTemplate>
+            <DataTemplate>
+                <Border BorderThickness="1" BorderBrush="Black" Margin="0,5">
+                    <DockPanel LastChildFill="True">
+                        <Path DockPanel.Dock="Left" Fill="YellowGreen" Width="20" Margin="10,0,10,0" HorizontalAlignment="Center" Data="{DynamicResource BubbleTailGeometry}"></Path>
+                        <TextBlock Padding="10" Text="{Binding Name}"></TextBlock>
+                    </DockPanel>
+                </Border>
+            </DataTemplate>
+        </ListBox.ItemTemplate>
+    </ListBox>
+{% endcode %}
+
+![ListBox.WrapPanelVerticalStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ListBox.WrapPanelVerticalStyle.png)
+
+{% endnote %}
+
+#  StackPanelHorizontalListBox : ListBoxCustom
+
+布局容器为StackPanel，水平方向显示样式。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <ListBox Margin="10" ItemsSource="{Binding Datas}"  
+             Style="{DynamicResource StackPanelHorizontalListBox}">
+        <ListBox.ItemTemplate>
+            <DataTemplate>
+                <Border BorderThickness="1" BorderBrush="Black" Margin="5,0">
+                    <DockPanel LastChildFill="True">
+                        <Path DockPanel.Dock="Left" Fill="YellowGreen" Width="20" Margin="10,0,10,0" HorizontalAlignment="Center" Data="{DynamicResource BubbleTailGeometry}"></Path>
+                        <TextBlock Padding="10" Text="{Binding Name}"></TextBlock>
+                    </DockPanel>
+                </Border>
+            </DataTemplate>
+        </ListBox.ItemTemplate>
+    </ListBox>
+{% endcode %}
+
+![ListBox.StackPanelHorizontalStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ListBox.StackPanelHorizontalStyle.png)
+
+{% endnote %}
+
+#  StackPanelVerticalListBox : ListBoxCustom
+
+布局容器为StackPanel，垂直方向显示样式。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <ListBox Margin="10" ItemsSource="{Binding Datas}"  
+             Style="{DynamicResource StackPanelVerticalListBox}">
+        <ListBox.ItemTemplate>
+            <DataTemplate>
+                <Border BorderThickness="1" BorderBrush="Black" Margin="0,1">
+                    <DockPanel LastChildFill="True">
+                        <Path DockPanel.Dock="Left" Fill="YellowGreen" Width="20" Margin="10,0,10,0" HorizontalAlignment="Center" Data="{DynamicResource BubbleTailGeometry}"></Path>
+                        <TextBlock Padding="10" Text="{Binding Name}"></TextBlock>
+                    </DockPanel>
+                </Border>
+            </DataTemplate>
+        </ListBox.ItemTemplate>
+    </ListBox>
+{% endcode %}
+
+![ListBox.StackPanelVerticalStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ListBox.StackPanelVerticalStyle.png)
+
+{% endnote %}
\ No newline at end of file
diff --git a/doc/source/handycontrol/native_controls/listView/index.md b/doc/source/handycontrol/native_controls/listView/index.md
index ca12ad62..10c9d1cb 100644
--- a/doc/source/handycontrol/native_controls/listView/index.md
+++ b/doc/source/handycontrol/native_controls/listView/index.md
@@ -1,5 +1,23 @@
 ---
-title: 建设中
+title: ListView 列表视图
 ---
 
-建设中
\ No newline at end of file
+`HandyControl`中仅提供了一个默认的`ListView`样式，可根据个人需求，自行定义。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <ListView ItemsSource="{Binding DataList}" Margin="20">
+        <ListView.View>
+            <GridView>
+                <GridViewColumn Width="80" Header="标题1" DisplayMemberBinding="{Binding Index}"/>
+                <GridViewColumn Width="100" Header="标题2" DisplayMemberBinding="{Binding Name}"/>
+                <GridViewColumn Width="200" Header="标题3" DisplayMemberBinding="{Binding Remark}"/>
+            </GridView>
+        </ListView.View>
+    </ListView>
+{% endcode %}
+
+![ListView.DefaultStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ListView.DefaultStyle.png)
+
+{% endnote %}
\ No newline at end of file
diff --git a/doc/source/handycontrol/native_controls/menu/index.md b/doc/source/handycontrol/native_controls/menu/index.md
index ca12ad62..28d0237f 100644
--- a/doc/source/handycontrol/native_controls/menu/index.md
+++ b/doc/source/handycontrol/native_controls/menu/index.md
@@ -1,5 +1,23 @@
 ---
-title: 建设中
+title: Menu 菜单
 ---
 
-建设中
\ No newline at end of file
+# MenuBaseStyle
+
+菜单默认样式，不推荐直接使用，应该始终被其它样式以BasedOn的方式使用。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <Menu ItemsSource="{Binding Menus}">
+        <Menu.ItemTemplate>
+            <HierarchicalDataTemplate ItemsSource="{Binding Children}">
+                <TextBlock Text="{Binding Name}"></TextBlock>
+            </HierarchicalDataTemplate>
+        </Menu.ItemTemplate>
+</Menu>
+{% endcode %}
+
+![Menu.BaseStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/Menu.BaseStyle.png)
+
+{% endnote %}
\ No newline at end of file
diff --git a/doc/source/handycontrol/native_controls/passwordBox/index.md b/doc/source/handycontrol/native_controls/passwordBox/index.md
index ca12ad62..0b72a68d 100644
--- a/doc/source/handycontrol/native_controls/passwordBox/index.md
+++ b/doc/source/handycontrol/native_controls/passwordBox/index.md
@@ -1,5 +1,45 @@
 ---
-title: 建设中
+title: PasswordBox 密码框
 ---
 
-建设中
\ No newline at end of file
+# PasswordBoxBaseStyle
+
+原生密码框默认样式，不推荐直接使用，应该始终被其它样式以BasedOn的方式使用。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <PasswordBox PasswordChar="*" VerticalAlignment="Center" Width="120"></PasswordBox>
+{% endcode %}
+
+![PasswordBox.BaseStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/PasswordBox.BaseStyle.png)
+
+{% endnote %}
+
+# PasswordBoxExtendBaseStyle : PasswordBoxBaseStyle
+
+原生密码框扩展默认样式，不推荐直接使用，应该始终被其它样式以BasedOn的方式使用。
+
+# PasswordBoxExtend : PasswordBoxExtendBaseStyle
+
+相对于原生密码框默认样式，它借助于附加属性可以实现标题、水印的功能。
+
+{% note info no-icon %}
+用例：
+{% code %}
+    <!--为使普通密码输入文本框显示水印,需要设定PasswordBoxAttach.PasswordLength="0"-->
+    <PasswordBox Style="{DynamicResource PasswordBoxExtend}" PasswordChar="*" 
+                 hc:PasswordBoxAttach.PasswordLength="0"
+                 hc:InfoElement.Placeholder="请输入密码" 
+                 VerticalAlignment="Center"
+                 Width="120"></PasswordBox>
+    <PasswordBox Style="{DynamicResource PasswordBoxExtend}" PasswordChar="*" 
+                 hc:TitleElement.Title="用户密码："
+                 hc:TitleElement.TitleAlignment="Top"
+                 VerticalAlignment="Center"
+                 Width="120"></PasswordBox>
+{% endcode %}
+
+![PasswordBox.ExtendStyle](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/PasswordBox.ExtendStyle.png)
+
+{% endnote %}
\ No newline at end of file
diff --git a/doc/source/handycontrol/native_controls/progressBar/index.md b/doc/source/handycontrol/native_controls/progressBar/index.md
index ca12ad62..8f5ca2a7 100644
--- a/doc/source/handycontrol/native_controls/progressBar/index.md
+++ b/doc/source/handycontrol/native_controls/progressBar/index.md
@@ -1,5 +1,79 @@
 ---
-title: 建设中
+title: ProgressBar 进度条
 ---
 
-建设中
\ No newline at end of file
+# ProgressBarBaseStyle
+
+进度条默认样式，不推荐直接使用，应该始终被其它样式以BasedOn的方式使用。
+
+# 其他样式
+
+`HandyControl`中自带的其他样式和效果，其中包含如下样式：
+
+| 样式Key            | 用途 |父样式|
+| ------------------ | ---- ||
+| ProgressBarSuccess | 成功色进度条 |ProgressBarBaseStyle|
+| ProgressBarInfo | 提示色进度条 |ProgressBarBaseStyle|
+| ProgressBarWarning | 警告色进度条 |ProgressBarBaseStyle|
+| ProgressBarDanger | 危险色进度条 |ProgressBarBaseStyle|
+| ProgressBarStripeBaseStyle | 条纹进度条默认样式（不推荐直接使用） |-|
+| ProgressBarPrimaryStripe | 主题色条纹进度条 |ProgressBarStripeBaseStyle|
+| ProgressBarSuccessStripe | 成功色条纹进度条 |ProgressBarStripeBaseStyle|
+| ProgressBarInfoStripe | 信息色条纹进度条 |ProgressBarStripeBaseStyle|
+| ProgressBarWarningStripe | 警告色条纹进度条 |ProgressBarStripeBaseStyle|
+| ProgressBarDangerStripe | 危险色条纹进度条 |ProgressBarStripeBaseStyle|
+| ProgressBarFlat | 扁平风格 |-|
+
+案例：
+```xml
+<StackPanel Margin="20">
+        <TextBlock Text="默认样式"></TextBlock>
+        <ProgressBar Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarSuccess"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarSuccess}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarInfo"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarInfo}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarWarning"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarWarning}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarDanger"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarDanger}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarPrimaryStripe"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarPrimaryStripe}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarSuccessStripe"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarSuccessStripe}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarInfoStripe"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarInfoStripe}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarWarningStripe"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarWarningStripe}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarDangerStripe"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarDangerStripe}" Value="40"></ProgressBar>
+    </StackPanel>
+    <StackPanel Margin="20">
+        <TextBlock Text="ProgressBarFlat"></TextBlock>
+        <ProgressBar Style="{DynamicResource ProgressBarFlat}" Value="40"></ProgressBar>
+    </StackPanel>
+```
+效果：
+![ProgressBar.Styles](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/native_controls/ProgressBar.Styles.png)
+
+# 温馨提示
+
+对于颜色、圆角或其它自定义需求，可参考[进度条样式源码](https://github.com/HandyOrg/HandyControl/blob/master/src/Shared/HandyControl_Shared/Themes/Styles/ProgressBar.xaml)自行定义。
\ No newline at end of file
diff --git a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml
index 77fb878d..5036e772 100644
--- a/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml
+++ b/src/Shared/HandyControlDemo_Shared/UserControl/Controls/NumericUpDownDemoCtl.xaml
@@ -9,6 +9,7 @@
             <StackPanel>
                 <hc:NumericUpDown/>
                 <hc:NumericUpDown Margin="0,32,0,0" IsEnabled="False"/>
+                <hc:NumericUpDown Margin="0,32,0,0" IsReadOnly="True"/>
 
                 <hc:NumericUpDown hc:InfoElement.Title="{x:Static langs:Lang.TitleDemoStr1}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownExtend}"/>
                 <hc:NumericUpDown hc:InfoElement.Placeholder="{x:Static langs:Lang.PlsEnterContent}" hc:InfoElement.Title="{x:Static langs:Lang.TitleDemoStr1}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownExtend}"/>
@@ -18,6 +19,7 @@
             <StackPanel Margin="32,0,0,0">
                 <hc:NumericUpDown Name="NumericUpDownCustomVerify" ShowClearButton="True" Style="{StaticResource NumericUpDownPlus}"/>
                 <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 ShowClearButton="True" hc:InfoElement.Title="{x:Static langs:Lang.TitleDemoStr1}" Margin="0,32,0,0" Style="{StaticResource NumericUpDownPlus}"/>
                 <hc:NumericUpDown hc:InfoElement.Placeholder="{x:Static langs:Lang.PlsEnterContent}" hc:InfoElement.Title="{x:Static langs:Lang.TitleDemoStr1}" Margin="0,32,0,0" hc:InfoElement.Necessary="True" Style="{StaticResource NumericUpDownPlus}"/>
diff --git a/src/Shared/HandyControl_Shared/Controls/Input/NumericUpDown.cs b/src/Shared/HandyControl_Shared/Controls/Input/NumericUpDown.cs
index 46a9ce1f..eac6fd1a 100644
--- a/src/Shared/HandyControl_Shared/Controls/Input/NumericUpDown.cs
+++ b/src/Shared/HandyControl_Shared/Controls/Input/NumericUpDown.cs
@@ -31,18 +31,24 @@ namespace HandyControl.Controls
         {
             CommandBindings.Add(new CommandBinding(ControlCommands.Prev, (s, e) =>
             {
+                if (IsReadOnly) return;
+
                 Value += Increment;
                 _textBox.Text = CurrentText;
                 _textBox.Select(_textBox.Text.Length, 0);
             }));
             CommandBindings.Add(new CommandBinding(ControlCommands.Next, (s, e) =>
             {
+                if (IsReadOnly) return;
+
                 Value -= Increment;
                 _textBox.Text = CurrentText;
                 _textBox.Select(_textBox.Text.Length, 0);
             }));
             CommandBindings.Add(new CommandBinding(ControlCommands.Clear, (s, e) =>
             {
+                if (IsReadOnly) return;
+
                 SetCurrentValue(ValueProperty, ValueBoxes.Double0Box);
                 _textBox.Text = string.Empty;
             }));
@@ -106,6 +112,8 @@ namespace HandyControl.Controls
 
         private void TextBox_PreviewKeyDown(object sender, KeyEventArgs e)
         {
+            if (IsReadOnly) return;
+
             if (e.Key == Key.Up)
             {
                 Value += Increment;
@@ -122,7 +130,7 @@ namespace HandyControl.Controls
         {
             base.OnMouseWheel(e);
 
-            if (_textBox.IsFocused)
+            if (_textBox.IsFocused && !IsReadOnly)
             {
                 Value += e.Delta > 0 ? Increment : -Increment;
                 _textBox.Text = CurrentText;
@@ -359,7 +367,22 @@ namespace HandyControl.Controls
         public bool ShowClearButton
         {
             get => (bool) GetValue(ShowClearButtonProperty);
-            set => SetValue(ShowClearButtonProperty, value);
+            set => SetValue(ShowClearButtonProperty, value); 
+        }
+
+        /// <summary>
+        ///     标识 IsReadOnly 依赖属性。
+        /// </summary>
+        public static readonly DependencyProperty IsReadOnlyProperty = DependencyProperty.Register(
+            "IsReadOnly", typeof(bool), typeof(NumericUpDown), new PropertyMetadata(ValueBoxes.FalseBox));
+
+        /// <summary>
+        ///     获取或设置一个值，该值指示NumericUpDown是否只读。
+        /// </summary>
+        public bool IsReadOnly
+        {
+            get => (bool) GetValue(IsReadOnlyProperty);
+            set => SetValue(IsReadOnlyProperty, value);
         }
 
         public Func<string, OperationResult<bool>> VerifyFunc { get; set; }
diff --git a/src/Shared/HandyControl_Shared/Themes/Styles/Base/NumericUpDownBaseStyle.xaml b/src/Shared/HandyControl_Shared/Themes/Styles/Base/NumericUpDownBaseStyle.xaml
index e41e3429..c69f0993 100644
--- a/src/Shared/HandyControl_Shared/Themes/Styles/Base/NumericUpDownBaseStyle.xaml
+++ b/src/Shared/HandyControl_Shared/Themes/Styles/Base/NumericUpDownBaseStyle.xaml
@@ -35,9 +35,9 @@
                                 <ColumnDefinition/>
                                 <ColumnDefinition Width="Auto"/>
                             </Grid.ColumnDefinitions>
-                            <controls:WatermarkTextBox Focusable="True" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
-                            <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="5,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
-                            <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="5,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                            <controls:WatermarkTextBox Focusable="True" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" IsReadOnly="{TemplateBinding IsReadOnly}"/>
+                            <Button x:Name="UpButton" Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="5,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                            <Button x:Name="DownButton"  Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="5,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
                         </Grid>
                     </Border>
                     <ControlTemplate.Triggers>
@@ -53,6 +53,10 @@
                         <Trigger Property="ShowUpDownButton" Value="False">
                             <Setter Property="Margin" TargetName="PART_TextBox" Value="2,0,2,1"/>
                         </Trigger>
+                        <Trigger Property="IsReadOnly" Value="True">
+                            <Setter Property="IsEnabled" TargetName="UpButton" Value="False"/>
+                            <Setter Property="IsEnabled" TargetName="DownButton" Value="False"/>
+                        </Trigger>
                     </ControlTemplate.Triggers>
                 </ControlTemplate>
             </Setter.Value>
@@ -75,9 +79,9 @@
                         <ColumnDefinition/>
                         <ColumnDefinition Width="Auto"/>
                     </Grid.ColumnDefinitions>
-                    <controls:WatermarkTextBox Margin="-2,0" CaretBrush="{TemplateBinding Foreground}" Focusable="True" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
-                    <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="5,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
-                    <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="5,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <controls:WatermarkTextBox Margin="-2,0" CaretBrush="{TemplateBinding Foreground}" Focusable="True" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" IsReadOnly="{TemplateBinding IsReadOnly}"/>
+                    <Button x:Name="UpButton" Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="5,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <Button x:Name="DownButton" Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="5,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
                 </Grid>
             </Border>
         </Grid>
@@ -91,6 +95,10 @@
             <Trigger Property="IsFocused" Value="true" SourceName="PART_TextBox">
                 <Setter Property="BorderBrush" TargetName="templateRoot" Value="{DynamicResource PrimaryBrush}"/>
             </Trigger>
+            <Trigger Property="IsReadOnly" Value="True">
+                <Setter Property="IsEnabled" TargetName="UpButton" Value="False"/>
+                <Setter Property="IsEnabled" TargetName="DownButton" Value="False"/>
+            </Trigger>
         </ControlTemplate.Triggers>
     </ControlTemplate>
 
@@ -110,9 +118,9 @@
                         <ColumnDefinition/>
                         <ColumnDefinition Width="Auto"/>
                     </Grid.ColumnDefinitions>
-                    <controls:WatermarkTextBox Margin="-2,0" CaretBrush="{TemplateBinding Foreground}" Focusable="True" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
-                    <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="5,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
-                    <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="5,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <controls:WatermarkTextBox Margin="-2,0" CaretBrush="{TemplateBinding Foreground}" Focusable="True" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" IsReadOnly="{TemplateBinding IsReadOnly}"/>
+                    <Button x:Name="UpButton"  Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="5,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <Button x:Name="DownButton" Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="5,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="1" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
                 </Grid>
             </Border>
         </Grid>
@@ -126,6 +134,10 @@
             <Trigger Property="IsFocused" Value="true" SourceName="PART_TextBox">
                 <Setter Property="BorderBrush" TargetName="templateRoot" Value="{DynamicResource PrimaryBrush}"/>
             </Trigger>
+            <Trigger Property="IsReadOnly" Value="True">
+                <Setter Property="IsEnabled" TargetName="UpButton" Value="False"/>
+                <Setter Property="IsEnabled" TargetName="DownButton" Value="False"/>
+            </Trigger>
         </ControlTemplate.Triggers>
     </ControlTemplate>
 
@@ -169,10 +181,10 @@
                         <ColumnDefinition Width="Auto"/>
                         <ColumnDefinition Width="25"/>
                     </Grid.ColumnDefinitions>
-                    <controls:WatermarkTextBox Padding="{TemplateBinding Padding}" x:Name="PART_TextBox" Watermark="{Binding Path=(controls:InfoElement.Placeholder),RelativeSource={RelativeSource TemplatedParent}}" HorizontalAlignment="Stretch" Grid.Column="0" Focusable="{TemplateBinding Focusable}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Grid.Row="0" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
+                    <controls:WatermarkTextBox Padding="{TemplateBinding Padding}" x:Name="PART_TextBox" Watermark="{Binding Path=(controls:InfoElement.Placeholder),RelativeSource={RelativeSource TemplatedParent}}" HorizontalAlignment="Stretch" Grid.Column="0" Focusable="{TemplateBinding Focusable}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Grid.Row="0" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" IsReadOnly="{TemplateBinding IsReadOnly}"/>
                     <Button Height="{x:Static system:Double.NaN}" Command="interactivity:ControlCommands.Clear" Name="ButtonClear"  Width="16" Visibility="Collapsed" Grid.Column="1" Style="{StaticResource ButtonIcon}" Padding="0,6" controls:IconElement.Geometry="{StaticResource DeleteFillCircleGeometry}" Foreground="{Binding BorderBrush,ElementName=templateRoot}"/>
-                    <Button Command="interactivity:ControlCommands.Prev" Padding="0,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
-                    <Button Command="interactivity:ControlCommands.Next" Padding="0,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <Button x:Name="UpButton" Command="interactivity:ControlCommands.Prev" Padding="0,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <Button x:Name="DownButton" Command="interactivity:ControlCommands.Next" Padding="0,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
                 </Grid>
             </Border>
         </Grid>
@@ -183,10 +195,15 @@
             <Trigger Property="IsMouseOver" Value="true" SourceName="templateRoot">
                 <Setter Property="BorderBrush" Value="{DynamicResource SecondaryBorderBrush}"/>
             </Trigger>
+            <Trigger Property="IsReadOnly" Value="True">
+                <Setter Property="IsEnabled" TargetName="UpButton" Value="False"/>
+                <Setter Property="IsEnabled" TargetName="DownButton" Value="False"/>
+            </Trigger>
             <MultiTrigger>
                 <MultiTrigger.Conditions>
                     <Condition Property="IsMouseOver" Value="true"/>
                     <Condition Property="ShowClearButton" Value="True"/>
+                    <Condition Property="IsReadOnly" Value="False"/>
                 </MultiTrigger.Conditions>
                 <Setter Property="Visibility" Value="Visible" TargetName="ButtonClear"/>
             </MultiTrigger>
@@ -231,10 +248,10 @@
                         <ColumnDefinition Width="Auto"/>
                         <ColumnDefinition Width="25"/>
                     </Grid.ColumnDefinitions>
-                    <controls:WatermarkTextBox x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" Watermark="{Binding Path=(controls:InfoElement.Placeholder),RelativeSource={RelativeSource TemplatedParent}}" HorizontalAlignment="Stretch" Grid.Column="0" Focusable="{TemplateBinding Focusable}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Grid.Row="0" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
+                    <controls:WatermarkTextBox x:Name="PART_TextBox" Padding="{TemplateBinding Padding}" Watermark="{Binding Path=(controls:InfoElement.Placeholder),RelativeSource={RelativeSource TemplatedParent}}" HorizontalAlignment="Stretch" Grid.Column="0" Focusable="{TemplateBinding Focusable}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Grid.Row="0" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" IsReadOnly="{TemplateBinding IsReadOnly}"/>
                     <Button Height="{x:Static system:Double.NaN}" Command="interactivity:ControlCommands.Clear" Name="PART_ButtonClear" Width="16" Visibility="Collapsed" Grid.Column="1" Style="{StaticResource ButtonIcon}" Padding="0,6" controls:IconElement.Geometry="{StaticResource DeleteFillCircleGeometry}" Foreground="{Binding BorderBrush,ElementName=templateRoot}"/>
-                    <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="0,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
-                    <Button Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="0,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <Button x:Name="UpButton"  Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Prev" Padding="0,7,5,1" Margin="0,0,0,14" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource UpGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
+                    <Button x:Name="DownButton" Visibility="{TemplateBinding ShowUpDownButton,Converter={StaticResource Boolean2VisibilityConverter}}" Command="interactivity:ControlCommands.Next" Padding="0,1,5,7" Margin="0,14,0,0" Focusable="False" Grid.Column="2" Foreground="{Binding BorderBrush,ElementName=templateRoot}" controls:IconElement.Geometry="{StaticResource DownGeometry}" Style="{StaticResource ButtonIcon}" Width="30" VerticalAlignment="Center" Height="14"/>
                 </Grid>
             </Border>
         </Grid>
@@ -245,10 +262,15 @@
             <Trigger Property="IsMouseOver" Value="true" SourceName="templateRoot">
                 <Setter Property="BorderBrush" Value="{DynamicResource SecondaryBorderBrush}"/>
             </Trigger>
+            <Trigger Property="IsReadOnly" Value="True">
+                <Setter Property="IsEnabled" TargetName="UpButton" Value="False"/>
+                <Setter Property="IsEnabled" TargetName="DownButton" Value="False"/>
+            </Trigger>
             <MultiTrigger>
                 <MultiTrigger.Conditions>
                     <Condition Property="IsMouseOver" Value="true"/>
                     <Condition Property="ShowClearButton" Value="True"/>
+                    <Condition Property="IsReadOnly" Value="False"/>
                 </MultiTrigger.Conditions>
                 <Setter Property="Visibility" Value="Visible" TargetName="PART_ButtonClear"/>
             </MultiTrigger>
diff --git a/src/Shared/HandyControl_Shared/Themes/Styles/Base/PoptipBaseStyle.xaml b/src/Shared/HandyControl_Shared/Themes/Styles/Base/PoptipBaseStyle.xaml
index 9c513359..76c1f24e 100644
--- a/src/Shared/HandyControl_Shared/Themes/Styles/Base/PoptipBaseStyle.xaml
+++ b/src/Shared/HandyControl_Shared/Themes/Styles/Base/PoptipBaseStyle.xaml
@@ -12,7 +12,7 @@
         <Setter Property="VerticalAlignment" Value="Top"/>
         <Setter Property="BorderThickness" Value="1"/>
         <Setter Property="Offset" Value="6"/>
-        <Setter Property="Background" Value="{DynamicResource BackgroundBrush}"/>
+        <Setter Property="Background" Value="{DynamicResource RegionBrush}"/>
         <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>
         <Setter Property="controls:BorderElement.CornerRadius" Value="{StaticResource DefaultCornerRadius}"/>
         <Setter Property="Padding" Value="{StaticResource DefaultControlPadding}"/>
diff --git a/src/Shared/HandyControl_Shared/Themes/Styles/Base/TextBoxBaseStyle.xaml b/src/Shared/HandyControl_Shared/Themes/Styles/Base/TextBoxBaseStyle.xaml
index 88975e61..b2179bd3 100644
--- a/src/Shared/HandyControl_Shared/Themes/Styles/Base/TextBoxBaseStyle.xaml
+++ b/src/Shared/HandyControl_Shared/Themes/Styles/Base/TextBoxBaseStyle.xaml
@@ -76,7 +76,7 @@
                 <RowDefinition MinHeight="{Binding Path=(controls:InfoElement.MinContentHeight),RelativeSource={RelativeSource TemplatedParent}}" Height="{Binding Path=(controls:InfoElement.ContentHeight),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource Double2GridLengthConverter}}"/>
             </Grid.RowDefinitions>
             <StackPanel Visibility="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource String2VisibilityConverter}}" Orientation="Horizontal" Margin="{TemplateBinding Padding}">
-                <TextBlock Foreground="{DynamicResource PrimaryTextBrush}" Margin="1,0,0,0" Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
+                <TextBlock Margin="1,0,0,0" Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
                 <ContentPresenter TextElement.Foreground="{DynamicResource DangerBrush}" Margin="4,0,0,0" Content="{Binding Path=(controls:InfoElement.Symbol),RelativeSource={RelativeSource TemplatedParent}}" Visibility="{Binding Path=(controls:InfoElement.Necessary),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource Boolean2VisibilityConverter}}"/>
             </StackPanel>
             <Border x:Name="border" Grid.Row="1" CornerRadius="{Binding Path=(controls:BorderElement.CornerRadius),RelativeSource={RelativeSource TemplatedParent}}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True"/>
@@ -105,7 +105,7 @@
                 <ColumnDefinition/>
             </Grid.ColumnDefinitions>
             <StackPanel Visibility="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource String2VisibilityConverter}}" Orientation="Horizontal" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="0,7,6,7">
-                <TextBlock Foreground="{DynamicResource PrimaryTextBrush}" Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
+                <TextBlock Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
                 <ContentPresenter TextElement.Foreground="{DynamicResource DangerBrush}" Margin="4,0,0,0" Content="{Binding Path=(controls:InfoElement.Symbol),RelativeSource={RelativeSource TemplatedParent}}" Visibility="{Binding Path=(controls:InfoElement.Necessary),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource Boolean2VisibilityConverter}}"/>
             </StackPanel>
             <Border x:Name="border" Grid.Column="1" CornerRadius="{Binding Path=(controls:BorderElement.CornerRadius),RelativeSource={RelativeSource TemplatedParent}}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True"/>
@@ -157,7 +157,7 @@
             </Grid.RowDefinitions>
             <TextBlock FontSize="12" Text="{TemplateBinding ErrorStr}" Name="TextBlockError" VerticalAlignment="Bottom" Margin="9,0,0,4" Foreground="{DynamicResource DangerBrush}" Grid.Row="1"/>
             <StackPanel Grid.Row="0" Visibility="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource String2VisibilityConverter}}" Orientation="Horizontal" Margin="{TemplateBinding Padding}">
-                <TextBlock Foreground="{DynamicResource PrimaryTextBrush}" Margin="1,0,0,0" Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
+                <TextBlock Margin="1,0,0,0" Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
                 <ContentPresenter TextElement.Foreground="{DynamicResource DangerBrush}" Margin="4,0,0,0" Content="{Binding Path=(controls:InfoElement.Symbol),RelativeSource={RelativeSource TemplatedParent}}" Visibility="{Binding Path=(controls:InfoElement.Necessary),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource Boolean2VisibilityConverter}}"/>
             </StackPanel>
             <Border Grid.Row="1" x:Name="templateRoot" CornerRadius="{Binding Path=(controls:BorderElement.CornerRadius),RelativeSource={RelativeSource TemplatedParent}}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
@@ -217,7 +217,7 @@
             </Grid.ColumnDefinitions>
             <TextBlock FontSize="12" Text="{TemplateBinding ErrorStr}" Name="TextBlockError" VerticalAlignment="Bottom" Margin="9,0,0,4" Foreground="{DynamicResource DangerBrush}" Grid.Column="1"/>
             <StackPanel Grid.Column="0" Visibility="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource String2VisibilityConverter}}" Orientation="Horizontal" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="0,7,6,7">
-                <TextBlock Foreground="{DynamicResource PrimaryTextBrush}" Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
+                <TextBlock Text="{Binding Path=(controls:InfoElement.Title),RelativeSource={RelativeSource TemplatedParent}}"/>
                 <ContentPresenter TextElement.Foreground="{DynamicResource DangerBrush}" Margin="4,0,0,0" Content="{Binding Path=(controls:InfoElement.Symbol),RelativeSource={RelativeSource TemplatedParent}}" Visibility="{Binding Path=(controls:InfoElement.Necessary),RelativeSource={RelativeSource TemplatedParent},Converter={StaticResource Boolean2VisibilityConverter}}"/>
             </StackPanel>
             <Border Grid.Column="1" x:Name="templateRoot" CornerRadius="{Binding Path=(controls:BorderElement.CornerRadius),RelativeSource={RelativeSource TemplatedParent}}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">