Merge pull request #288 from HandyOrg/pr/250

Pr/250
This commit is contained in:
NaBian authored and GitHub committed 2020-01-05 21:48:47 +08:00
commit 98c277ca6f
3 files changed
+243 -6

No files matched your search

@@ -1,5 +1,18 @@
---
title: 建设中
title: Image图片
---
建设中
在`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 %}
@@ -1,5 +1,87 @@
---
title: 建设中
title: Lable标签
---
建设中
# 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 %}
@@ -1,5 +1,147 @@
---
title: 建设中
title: ListBox 列表框
---
建设中
# 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 %}