Page tree
Skip to end of metadata
Go to start of metadata

以下主题将详细介绍如何自定义C1Toolbar 控件的布局和外观,您可以使用内置的布局选项在面板中配置您的布局,如网格或者画布。
您可以通过使用堆叠面板自定义您工具栏项的外观,在堆叠面板中您可以决定您工具栏项的方向,此外您还可以添加图像和文本,以及更改文本的对齐,字体的样式和颜色。

XAML

<c1tb:C1Toolbar>
<c1tb:C1ToolbarGroup Header="Clipboard">
<c1tb:C1ToolbarStrip Padding="0">
<c1tb:C1ToolbarButton Width="60" HorizontalContentAlignment="Left">
<StackPanel Orientation="Horizontal" >
<Image Grid.Column="1" Source="Resources/cut.png" Margin="7 0 7 0"/>
<TextBlock Text="Cut" Foreground= "DarkOrange" VerticalAlignment="Center"
TextAlignment="Center" />
</StackPanel>
</c1tb:C1ToolbarButton>
</c1tb:C1ToolbarStrip>
<c1tb:C1ToolbarStrip Padding="0">
<c1tb:C1ToolbarButton Width="60" HorizontalContentAlignment="Left" >
<StackPanel Orientation="Horizontal">
<Image Source="Resources/copy.png" Margin="4 0 4 0"/>
<TextBlock Text="Copy" VerticalAlignment="Center" TextAlignment="Center"/> </StackPanel>
</c1tb:C1ToolbarButton>
</c1tb:C1ToolbarStrip>
<c1tb:C1ToolbarStrip Padding="0">
<c1tb:C1ToolbarButton Width="60" HorizontalContentAlignment="Left">
<StackPanel Orientation="Horizontal">
<Image Source="Resources/paste.png" Margin="4 0 4 0"/>
<TextBlock Text="Paste" VerticalAlignment="Center"
TextAlignment="Center"/>
</StackPanel>
</c1tb:C1ToolbarButton>
</c1tb:C1ToolbarStrip>
</c1tb:C1ToolbarGroup>
</c1tb:C1Toolbar>


 Toolbar布局

当您使用C1ToolbarStrip时可以选择您工具栏的方向,水平(默认)或者垂直。
C1Toolbar控件中的带状面板可以通过设置C1ToolbarStrip.Orientation 属性水平或者垂直呈现,在C1Toolbar中独立子元素的布局也可以使用StackPanel.Orientation 属性来控制。

您可以使用GroupSizeDefinitionC1ToolbarGroup中所有的C1ToolbarButtonsC1ToolbarToggleButtons 定义统一的尺寸(小,中,或者大)。
GroupSizeDefinition 定义了按钮的大中小尺寸以及在C1ToolbarGroup中按钮文本的位置,如果设置为"large",此时在组中的所有按钮可以从LargeImageSource属性获取图像资源及将LabelTitle属性中的文本值置于图像下方,如果设置为"meidum",此时在组中的所有按钮可以从SmallImageSource属性获取图像资源及将LabelTitle属性中的文本值置于
图像右边,如果设置为"small",此时在组中的所有按钮可以从SmallImageSource属性获取图像资源且不显示文本信息。
下图使用LargeImageResource 属性的按钮及LabelTitle 属性的文本在图片下方显示:

下图使用SmallImageResource 属性的按钮及LabelTitle 属性的文本在图片右方显示:

下图仅显示使用SmallImageResource 属性的按钮:

 C1Toolbar模板

WPF及及Silverlight版版控件的一个优势在于控件具有完全自定义的"无外观"用户界面,例如您在为WPF或Silverlight应用设
计用户界面(UI)时,可以通过WPF及及Silverlight版版Toolbar来实现适用于数据管理的UI。可扩展标记语言(XAML;发音为"Zammel")是一种基于XML的声明式语言,它提供了一种简易的方式可以不用编写代码就可以完成您的UI设计。
可访问模板可访问模板
您可以访问Microsoft Expression Blend获取模板,选择C1Toolbar控件并在对象菜单中选择编辑模板编辑模板,通过选择编辑拷贝来创建当前模板可编辑的一个拷贝,或者选择创建一个新的空白模板空白模板。
一旦您创建了一个新的模板,该模板将会出现在Objects and Timeline 窗口中,注意您可以使用Template 属性自定义模板。

注意:注意:如果您通过菜单方式创建了一个新的模板,模板将会自动的连接模板的属性,但如果您用XAML手动创建了一个模板,您就必须为您创建的模板提供适宜的模板属性。


附加模板附加模板
除了默认模板外,C1Toolbar 控件还包括几个附加模板,这些模板可以通过Microsoft Expression Blend 来访问–在
Blend中选择C1Toolbar 控件以及在菜单中选择 Edit Additional Templates,选择一个模板并选择Create Empty

 ComponentOne ClearStyle技术

ComponentOne ClearStyle技术是一项新颖,快速且简捷的方法,它为Silverlight及WPF版控件提供样式支持,
ClearStyle可以帮助您避免处理大量繁琐的XAML模板和样式资源,可以为控件创建一个自定义样式。
目前,如果您需要在所有标准的WPF及Silverlight控件上添加一个主题,就必须要创建一个样式资源模板,然而这个过
程在Microsoft Visual Studio上完成是困难的,这就是为什么Microsoft要引入Expression Blend来简化此任务,但是对于那些不熟悉Blend平台或者没有时间学习的开发人员来说,两个平台的转换对于他们来说是一项挑战,此外您还需要一名设计人员,然而您的设计人员和开发人员需要共享XAML文件,这无疑也增加了开发的复杂性。
因此我们将ClearStyle技术引入,想以尽可能直观的方式引入到Visual Studio开发中。在大多数情况下,您可能只需要对应用中的控件做出简单的改变,而这个过程也需要尽可能简化。例如,你仅想改变数据网格的行的颜色,这里就只需要简单地设置一项属性,而不是创建一个完整而复杂的模板对颜色做出改变。

 如何使用ClearStyle

控件样式的每个关键部分都应该是可以直接操作的,如一个简单的颜色属性,这就导致需要对每个控件制定一系列独特的样式属性。例如,一个Gauge有PointerFillPointerStroke两种属性,而一个DataGrid具有SelectedBrushMouseOverBrush两种行特性。
比方说,在您的窗体里有一个控件不支持ClearStyle,您可以通过ClearStyle创建XAML资源并以此匹配您窗体中的其他其他控件(如抓取确切的颜色),或者您想要利用ClearStyle覆盖样式的部分内容(如自定义的滚动条),这都可以通过ClearStyle实现,因为ClearStyle是可扩展并可以覆盖您需要的样式区域。
ClearStyle旨在成为一个快速、便捷的样式改变解决方案,但您依然可以采取老式的ComponentOne控件样式获取需方法,而且ClearStyle不会干预那些不常用的属性,那些属性通常需要完整的自定义设计。

 Toolbar ClearStyle属性

C1Toolbar 支持ComponentOne's ClearStyle技术,可以帮助您不用改变控件的模板就可以轻松的对控件的颜色做出更改。通过设置几个颜色的属性,您就可以快速的设置C1Toolbar元素的样式,C1Toolbar 支持的属性如下表:

Property

Description

Background

获取或设置用以填充C1Toolbar的背景。

MouseOverBrush

获取或设置画笔用以高亮控件,当鼠标悬置于控件上方时。

PressedBrush

获取或设置画笔用以绘制一个按钮,当它被按压时。

FocusBrush

获取或设置画笔,用以控件聚焦时的高亮。

Header (仅适用于C1ToolbarGroup)

获取或设置画笔用以绘制标题。


  • No labels