ggcy-add doc of passwordattach and statusSwitchElement

2019-11-10 13:12:26 +08:00
1 parent 1221d12aee
commit ed72c473ea
@@ -1,5 +1,46 @@
 ---
-title: 建设中
+title: PasswordBoxAttach密码框专用
 ---

-建设中
+# 属性
+
+该部分附加属性，仅仅适用于`HandyControl`自定义控件`hc:PasswordBox`以及部分`HandyControl`自带的`PasswordBox`的样式
+
+| 名称           | 用途     |
+| -------------- | -------- |
+| IsMonitoring   | 是否监测 |
+| PasswordLength | 密码长度 |
+
+#  案例
+
+对应`xaml`中添加`HandyControl`对应的命名空`xmlns:hc="https://handyorg.github.io/handycontrol"`
+
+## IsMonitoring 是否监测
+
+设定是否启用监听该`PasswordBox`控件，用于进行密码长度的判定和其他逻辑处理，单独使用无明显可视化效果
+
+```xml
+    <hc:PasswordBox hc:PasswordBoxAttach.IsMonitoring="True"
+                 Width="100"
+                 Height="Auto"></hc:PasswordBox>
+```
+
+
+
+## PasswordLength 密码长度
+
+当密码长度为0时，显示输入提示信息，录入密码，水印消失
+
+```xml
+    <hc:PasswordBox hc:PasswordBoxAttach.IsMonitoring="True"
+                 hc:PasswordBoxAttach.PasswordLength="10"
+                 Width="100"
+                 Height="Auto"
+                 VerticalAlignment="Center"
+                 hc:InfoElement.Placeholder="请输入密码"></hc:PasswordBox>
+```
+
+效果：
+
+![PasswordAttach.Length](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/PasswordAttach.Length.png)
+
@@ -1,5 +1,82 @@
 ---
-title: 建设中
+title: StatusSwitchElement可切换状态的元素
 ---

-建设中
+# 属性
+
+| 名称                 | 用途             |
+| -------------------- | ---------------- |
+| CheckedElement       | 选中时展示的元素 |
+| HideUncheckedElement | 是否隐藏元素     |
+
+# 案例
+
+对应`xaml`中添加`HandyControl`对应的命名空`xmlns:hc="https://handyorg.github.io/handycontrol"`
+
+##  CheckedElement 选中时展开元素
+
+此附加属性适用于`ToggleButton`以及子类控件，用于控制选择类控件选中时，显示的控件内容，默认情况为`False`不显示
+
+```xml
+    <ToggleButton Style="{DynamicResource ToggleButtonCustom}" Margin="5">
+        <!--Checked-->
+        <hc:StatusSwitchElement.CheckedElement>
+            <Border Width="60" Height="20" CornerRadius="4" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}">
+                <Ellipse Width="20" Height="20" Fill="{DynamicResource PrimaryBrush}" StrokeThickness="1" Stroke="{DynamicResource BorderBrush}"/>
+            </Border>
+        </hc:StatusSwitchElement.CheckedElement>
+        <!--Default-->
+        <Border Width="80" Height="30" CornerRadius="0" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}">
+            <Ellipse Width="20" Height="20" Fill="{DynamicResource BorderBrush}" StrokeThickness="1" Stroke="{DynamicResource BorderBrush}"/>
+        </Border>
+    </ToggleButton>
+```
+
+效果：
+
+默认状态（非选中时）和选中状态
+
+![StatusSwitchElement.CheckedElement](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/StatusSwitchElement.CheckedElement.png)
+
+##  HideUncheckedElement 是否隐藏元素
+
+控制选中状态时是否隐藏默认元素，默认为`False`不隐藏
+
+```xml
+    <ToggleButton IsChecked="True" Style="{DynamicResource ToggleButtonCustom}" Margin="5">
+        <!--Checked-->
+        <hc:StatusSwitchElement.CheckedElement>
+            <Border Width="60" Height="20" CornerRadius="0" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}">
+                <Ellipse Width="20" Height="20" Fill="{DynamicResource PrimaryBrush}" StrokeThickness="1" Stroke="{DynamicResource BorderBrush}"/>
+            </Border>
+        </hc:StatusSwitchElement.CheckedElement>
+        <!--Default-->
+        <Border Width="80" Height="30" CornerRadius="0" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}">
+            <Ellipse Width="20" Height="20" Fill="{DynamicResource BorderBrush}" StrokeThickness="1" Stroke="{DynamicResource BorderBrush}"/>
+        </Border>
+    </ToggleButton>
+<!--显式设定选中状态下隐藏默认内容元素-->
+<ToggleButton IsChecked="True" Style="{DynamicResource ToggleButtonCustom}" hc:StatusSwitchElement.HideUncheckedElement="True" Margin="5">
+        <!--Checked-->
+        <hc:StatusSwitchElement.CheckedElement>
+            <Border Width="60" Height="20" CornerRadius="0" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}">
+                <Ellipse Width="20" Height="20" Fill="{DynamicResource PrimaryBrush}" StrokeThickness="1" Stroke="{DynamicResource BorderBrush}"/>
+            </Border>
+        </hc:StatusSwitchElement.CheckedElement>
+        <!--Default-->
+        <Border Width="80" Height="30" CornerRadius="0" BorderThickness="1" BorderBrush="{DynamicResource BorderBrush}">
+            <Ellipse Width="20" Height="20" Fill="{DynamicResource BorderBrush}" StrokeThickness="1" Stroke="{DynamicResource BorderBrush}"/>
+        </Border>
+    </ToggleButton>
+```
+
+效果：
+
+![StatusSwitchElement.HideUncheckedElement](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/StatusSwitchElement.HideUncheckedElement.png)
+
+{%  note info no-icon %}
+
+以上两个属性，组合使用，能够简单的控制选择类控件状态的展示功能，可根据以上案例进行合理调整
+
+{% endnote %}
+