私は Windows Phone アプリを作成しており、繰り返し使用されるカスタム アイコン ボタンを作成しました。ボタンは次の図のようになります。
DRY (Don't Repeat Yourself) の原則に従うために、基本的に継承したクラスを作成し、次Buttonのタイプのカスタム パラメータを追加しましたControlTemplate。IconTemplate
Text簡潔にするために、プロパティに関する部分は省略しました
public class IconButton : Button
{
public static readonly DependencyProperty IconTemplateProperty =
DependencyProperty.Register(
"IconTemplate",
typeof(ControlTemplate),
typeof(IconButton),
null);
public ControlTemplate IconTemplate
{
get { return (ControlTemplate)GetValue(IconTemplateProperty); }
set { SetValue(IconTemplateProperty, value); }
}
}
クラスを作成した後、このクラスに何らかのスタイルを適用するResource呼び出しを作成しました。Generic.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:c="clr-namespace:PiadasEngracadas.Controls"
<Style TargetType="c:IconButton">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/>
<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
<Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/>
<Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/>
<Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="c:IconButton">
<Grid Background="{TemplateBinding Background}" x:Name="ButtonBackground">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver"/>
<VisualState x:Name="Pressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="IconTemplateContainer">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="IconTemplateContainer">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground">
<DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ContentControl x:Name="IconTemplateContainer"
Template="{TemplateBinding IconTemplate}" />
<TextBlock VerticalAlignment="Bottom"
HorizontalAlignment="Right"
Margin="{StaticResource PhoneHorizontalMargin}"
FontFamily="{StaticResource PhoneFontFamilyLight}"
Text="{TemplateBinding Text}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
したがって、このようなボタンを作成するだけで、外観は正しくなります。
<c:IconButton Text="Some Text"
IconTemplate="{StaticResource IconsButtons.Sleepy}" />
Path's Stroke問題は、ユーザーがボタンをタップしたときに色を変更したいということです。
このボタンは何度も使用するので、ボタンがタップされたときに新しいストロークの色を定義する別のプロパティがあれば価値があるのではないかと考えました。何かのようなもの：
<c:IconButton Text="Some Text"
TappedColor="#123456" // New property
IconTemplate="{StaticResource IconsButtons.Sleepy}" />
Pathしかし、問題は、 のTemplate(?) であるの色を変更する方法がわからないことですContentControl。私は次のようなことを考えていました：
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="(IconTemplateContainer).(Template).(Stroke)">
この構文が完全に間違っていることはわかっていますが、誰かが私の目標を達成するのを手伝ってくれるのではないかと思います.
PS: を直接使用して のプロパティにバインドするだけでは WP では機能しないため、すべてPathの を a でラップしています(または、少なくとも私はそれを機能させるほど賢くありません)。この場合でも、Content VisualState` 内のオブジェクトのプロパティを変更するにはどうすればよいでしょうか?ControlTemplatePathContentContentControlContentControlfor a certain
アップデート
ControlTemplateコードは次のとおりです。
<ControlTemplate x:Key="IconsButtons.Sleepy">
<Path Data="M32.000099,44.658999C36.566562,44.658999 39.162999,47.058804 ...."
Stretch="Uniform"
Fill="#FFFFFFFF"
Width="26"
Height="26"
Margin="0"
RenderTransformOrigin="0.5,0.5">
<Path.RenderTransform>
<TransformGroup>
<TransformGroup.Children>
<RotateTransform Angle="0" />
<ScaleTransform ScaleX="1" ScaleY="1" />
</TransformGroup.Children>
</TransformGroup>
</Path.RenderTransform>
</Path>
</ControlTemplate>