add doc of titleElement

add doc of InfoElement
2019-11-03 23:40:54 +08:00
1 parent c6e4f2d879
commit 70f69763fa
@@ -1,5 +1,81 @@
 ---
-title: 建设中
+title: InfoElement信息元素
 ---

-建设中
+{%  note info no-icon %}
+
+继承至[TitleElement]( https://handyorg.github.io/handycontrol/attach/titleElement/ )
+
+{% endnote%}
+
+# 属性
+
+| 名称             | 用途               |
+| ---------------- | ------------------ |
+| Placeholder      | 占位符（输入提示） |
+| Necessary        | 是否必填           |
+| Symbol           | 标记信息           |
+| ContentHeight    | 内容高度           |
+| MinContentHeight | 最小内容高度       |
+| MaxContentHeight | 最大内容高度       |
+
+# 使用案例
+
+对应`xaml`引入`handycontrol`对应的命名空间
+
+```xml
+xmlns:hc="https://handyorg.github.io/handycontrol"
+```
+
+## `Placeholder` 占位符
+
+```xml
+    <hc:SearchBar Style="{StaticResource SearchBarExtend}" Margin="10,10"/>
+    <hc:SearchBar hc:InfoElement.Placeholder="请输入查询条件" Style="{StaticResource SearchBarExtend}" Margin="10,10"/>
+```
+
+效果：
+
+![InfoElement.Placeholder](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/InfoElement.Placeholder.png)
+
+## `Necessary` 是否必填
+
+```xml
+    <hc:SearchBar hc:InfoElement.Placeholder="请输入查询条件" 
+                  hc:InfoElement.Title="查询条件" 
+                  Margin="10,10" hc:InfoElement.Necessary="True" 
+                  Style="{StaticResource SearchBarExtend}"/>
+```
+
+其中`hc:InfoElement.Title="查询条件" `为继承至父类
+
+效果：
+
+![InfoElement.Necssary](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/InfoElement.Necssary.png)
+
+## `Symbol` 标记信息
+
+```xml
+    <hc:SearchBar hc:InfoElement.Placeholder="请输入内容" 
+              hc:InfoElement.Title="此项必填" Style="{StaticResource SearchBarExtend}" 
+              Margin="10,10" hc:InfoElement.Necessary="True" 
+              hc:InfoElement.Symbol="x"/>
+```
+
+效果：
+
+![InfoElement.Symbol](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/InfoElement.Symbol.png)
+
+## `ContentHeight` 内容高度
+
+```xml
+    <hc:SearchBar hc:InfoElement.Placeholder="请输入查询条件" 
+                  hc:InfoElement.ContentHeight="50"
+                  hc:InfoElement.Title="查询条件" 
+                  Margin="10,10" hc:InfoElement.Necessary="True" 
+                  Style="{StaticResource SearchBarExtend}"/>
+```
+
+效果：
+
+![InfoElement.ContentHeight](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/InfoElement.ContentHeight.png)
@@ -1,5 +1,68 @@
 ---
-title: 建设中
+title: TitleElement标题元素
 ---

-建设中
+# 属性
+
+| 名称           | 用途         |
+| -------------- | ------------ |
+| Title          | 标题信息     |
+| Background     | 标题背景色   |
+| Foreground     | 标题字体色   |
+| BorderBrush    | 标题边框色   |
+| TitleAlignment | 标题对齐方式 |
+| TitleWidth     | 标题宽度     |
+
+# 使用案例
+
+对应`xaml`引入`handycontrol`对应的命名空间
+
+```xml
+xmlns:hc="https://handyorg.github.io/handycontrol"
+```
+
+## `Title` 标题信息
+
+```xml
+    <hc:TextBox hc:TitleElement.Title="标题信息"
+                Margin="10,10"></hc:TextBox>
+```
+
+效果：
+![TitleElement.Title](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/TitleElement.Title.png)
+
+## `TitleAlignment` 标题对齐方式
+
+```xml
+    <!--标题居于顶侧-->
+    <hc:TextBox hc:TitleElement.Title="标题信息"
+             hc:TitleElement.TitleAlignment="Top"
+             Margin="10,10"></hc:TextBox>
+    <!--标题居于左侧-->
+    <hc:TextBox hc:TitleElement.Title="标题信息"
+             hc:TitleElement.TitleAlignment="Left"
+             Margin="10,10"></hc:TextBox>
+```
+
+效果：
+
+![TitleElement.TitleAlignment](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/TitleElement.TitleAlignment.png)
+
+## `TitleWidth` 标题宽度
+
+```xml
+        <!--设定TitleWidth为Auto-->
+        <hc:TextBox hc:TitleElement.Title="标题信息"
+             hc:TitleElement.TitleAlignment="Left"
+             hc:TitleElement.TitleWidth="Auto"
+             Margin="10,10"></hc:TextBox>
+        <!--设定TitleWidth为具体数值-->
+        <hc:TextBox hc:TitleElement.Title="标题信息"
+             hc:TitleElement.TitleAlignment="Left"
+             hc:TitleElement.TitleWidth="60"
+             Margin="10,10"></hc:TextBox>
+```
+
+效果：
+
+![TitleElement.TitleWidth](https://raw.githubusercontent.com/HandyOrg/HandyOrgResource/master/HandyControl/Doc/attach/TitleElement.TitleWidth.png)