[WP 7.5] 用C#替換Control的Template

2012-05-11

在最近開發的專案中

常常使用到需要將某些Control項依據需要動態更換Template

以下是我以UserControl內的Button為例(這還蠻常用到的 ^_^)

1.首先先到Expression Blend 去新增兩個Template，我以FancyButton當成一般狀態的按鈕樣式，FancyButtonPress當成按下後想要呈現的樣式


<UserControl.Resources>
		<ControlTemplate x:Key="FancyButton" TargetType="Button">
			<Border x:Name="border" Height="85" Width="160" BorderThickness="1" BorderBrush="#FFD27C3F">
				<Border.Background>
					<LinearGradientBrush EndPoint="0.5,1" MappingMode="RelativeToBoundingBox" StartPoint="0.5,0">
						<GradientStop Color="#FFD0B057" Offset="0.004"/>
						<GradientStop Color="#FFDCBE6A" Offset="1"/>
						<GradientStop Color="#FFCA9400" Offset="0.472"/>
					</LinearGradientBrush>
				</Border.Background>
				<VisualStateManager.VisualStateGroups>
					<VisualStateGroup x:Name="CommonStates">
						<VisualStateGroup.Transitions>
							<VisualTransition From="Normal" GeneratedDuration="0" To="Pressed">
								<Storyboard>
									<DoubleAnimation Duration="0:0:0.3" To="0.6" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="textBlock"/>
								</Storyboard>
							</VisualTransition>
						</VisualStateGroup.Transitions>
						<VisualState x:Name="Disabled"/>
						<VisualState x:Name="Normal"/>
						<VisualState x:Name="MouseOver"/>
						<VisualState x:Name="Pressed">
							<Storyboard>
								<ColorAnimation Duration="0" To="#FF020202" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/>
								<DoubleAnimation Duration="0" To="0.6" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/>
								<ColorAnimation Duration="0" To="#FFCA8200" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
								<ColorAnimation Duration="0" To="#FFD07357" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
								<ColorAnimation Duration="0" To="#FFD07357" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
							</Storyboard>
						</VisualState>
					</VisualStateGroup>
				</VisualStateManager.VisualStateGroups>
				<TextBlock x:Name="textBlock" TextWrapping="Wrap" Text="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="#FF080808" FontSize="24"/>
			</Border>
		</ControlTemplate>
		<ControlTemplate x:Key="FancyButtonPress" TargetType="Button">
			<Border Width="160" Height="85" BorderBrush="#FFD27C3F" BorderThickness="1">
				<Border.Background>
					<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
						<GradientStop Color="#FFD07357" Offset="0"/>
						<GradientStop Color="#FFD07357" Offset="1"/>
						<GradientStop Color="#FFCA8200" Offset="0.515"/>
					</LinearGradientBrush>
				</Border.Background>
				<TextBlock TextWrapping="Wrap" Text="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center" Opacity="0.6" Foreground="Black" FontSize="24"/>
			</Border>
		</ControlTemplate>
	</UserControl.Resources>

2.預設按鈕會設定某個樣式，並在按鈕按下後替換Template


var Press = this.Resources.First(n => n.Key.ToString() == "FancyButtonPress").Value as ControlTemplate;

btnImage.Template = Press;

3.我是用Linq去找出樣式，不知道這種寫法好不好，如有問題敬請指教 thx

回首頁