1. ホーム
  2. 質問と答え
  3. UWP派生ボタン：スタイル内のバインド

UWP派生ボタン：スタイル内のバインド

2016-11-04 21 views
0

一般：カスタムコントロールのStyleで、それは<Setter Property="MyFirstProperty">内から別のDependencyProperty（例えばMySecondProperty）値にバインドすることは可能でしょうか？UWP派生ボタン：スタイル内のバインド

どのような目的のためにですか？次を達成するには

）1. MyButton : Buttonコントロールを生成します。このコントロールには、追加のList<string> FlyoutSource依存プロパティがあります。

2）（）MyButton : ButtonためButton.Flyoutプロパティを定義<Setter Property="Flyout">要素を有し、MyButtonStyleを定義します。

<local:MyButton 
    FlyoutSource="{x:Bind FlyoutSourceList, Mode=TwoWay}" 
    Style="{StaticResource MyButtonStyle}"> 
</local:MyButton

詳細：

Flyoutは、私は解決策を使用したいどのようにMyButton.FlyoutSource

<Style TargetType="local:MyButton" x:Key="MyButtonStyle"> 
    <Setter Property="Background" Value="Green"/> 
    <Setter Property="Flyout"> 
     <Setter.Value> 
      <Flyout> 
       <!-- &&&&&&& THE FOLLOWING LINE DOES NOT WORK PROPERLY &&&&&&& --> 
       <ListView ItemsSource="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=FlyoutSource}"> 
        <ListView.ItemTemplate> 
         <DataTemplate> 
          <TextBlock Text="{Binding}"/> 
         </DataTemplate> 
        </ListView.ItemTemplate> 
       </ListView> 
      </Flyout> 
     </Setter.Value> 
    </Setter> 
</Style>

にバインドする必要があり、そのItemsSource、それにListViewを持つことになりますにMyButtonクラス：

public class MyButton : Button 
{ 
    public MyButton() 
    { 
     this.DefaultStyleKey = typeof(Button); 
    } 

    public static DependencyProperty FlyoutSourceProperty = DependencyProperty.Register(
    "FlyoutSource", typeof(List<string>), typeof(MyButton), 
    new PropertyMetadata(null, new PropertyChangedCallback(OnFlyoutSourceChanged))); 

    public List<string> FlyoutSource 
    { 
     get { return (List<string>)GetValue(FlyoutSourceProperty); } 
     set { SetValue(FlyoutSourceProperty, value); } 
    } 

    public static void OnFlyoutSourceChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e) 
    { 
     Debug.WriteLine(""); 
    } 
}

出典

2016-11-04 bunkerdive

+0

ここであなたが何を求めているのか分かりません。すべてのまたは特定のボタンインスタンスに標準のフライアウトテンプレートを適用する方法を尋ねていますか？

+0

質問を更新しています。最終的に、私は 'Button'から派生したコントロールを作成しようとしていますが、カスタムボタンのDPに' ItemsSource'がバインドされた 'ListView'を含むフライアウトを作成します。 – bunkerdive

答えて

0

実際にはButtonをサブクラス化する必要はありません。FlyoutSourceを添付プロパティにするだけです。

RelativeSourceモードTemplatedParentは、ControlTemplate内に存在しないため、ここでは使用できません。

フライアウトコンテンツが添付された要素から情報を取得する唯一の方法は、DataContextの継承によるものと思われます。私はこれを考え出すことしかできませんでしたが、拘束力のある体操がたくさんあります。私はそれをお勧めしません。

public class ViewProps 
{ 
    public static object GetFlyoutListSource(DependencyObject obj) 
    { 
     return (object)obj.GetValue(FlyoutListSourceProperty); 
    } 

    public static void SetFlyoutListSource(DependencyObject obj, object value) 
    { 
     obj.SetValue(FlyoutListSourceProperty, value); 
    } 

    public static readonly DependencyProperty FlyoutListSourceProperty = 
     DependencyProperty.RegisterAttached("FlyoutListSource", typeof(object), typeof(ViewProps), new PropertyMetadata(null)); 
} 

<Grid x:Name="MyGrid"> 
    <Grid.Resources> 
     <Style x:Key="FlyoutButton" TargetType="Button"> 
      <Setter Property="Flyout"> 
       <Setter.Value> 
        <Flyout> 
         <ListView ItemsSource="{Binding (local:ViewProps.FlyoutListSource)}"/> 
        </Flyout> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Grid.Resources> 

    <Button 
     Style="{StaticResource FlyoutButton}" 
     Content="Button" 
     DataContext="{Binding RelativeSource={RelativeSource Self}}" 
     local:ViewProps.FlyoutListSource="{Binding ElementName=MyGrid, Path=DataContext.ItemsSource}"/> 
</Grid>

ボタンをサブクラス化したい場合は、このような何かを行うことができます。

ListFlyoutButton.cs

public sealed class ListFlyoutButton : Button 
{ 
    public object ItemsSource 
    { 
     get { return (object)GetValue(ItemsSourceProperty); } 
     set { SetValue(ItemsSourceProperty, value); } 
    } 

    public static readonly DependencyProperty ItemsSourceProperty = 
     DependencyProperty.Register("ItemsSource", typeof(object), typeof(ListFlyoutButton), new PropertyMetadata(null)); 

    public ListFlyoutButton() 
    { 
     this.DefaultStyleKey = typeof(ListFlyoutButton); 
    } 

    protected override void OnApplyTemplate() 
    { 
     base.OnApplyTemplate(); 

     ((FrameworkElement)((Flyout)Flyout).Content).DataContext = this; 
    } 
}

テーマGeneric.xaml \

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="***"> 

    <Style TargetType="local:ListFlyoutButton"> 
     <Setter Property="Background" Value="{ThemeResource ButtonBackground}" /> 
     <Setter Property="Foreground" Value="{ThemeResource ButtonForeground}" /> 
     <Setter Property="BorderBrush" Value="{ThemeResource ButtonBorderBrush}" /> 
     <Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}" /> 
     <Setter Property="Padding" Value="8,4,8,4" /> 
     <Setter Property="HorizontalAlignment" Value="Left" /> 
     <Setter Property="VerticalAlignment" Value="Center" /> 
     <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" /> 
     <Setter Property="FontWeight" Value="Normal" /> 
     <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" /> 
     <Setter Property="UseSystemFocusVisuals" Value="True" /> 
     <Setter Property="FocusVisualMargin" Value="-3" /> 
     <Setter Property="Flyout"> 
      <Setter.Value> 
       <Flyout> 
        <ListView ItemsSource="{Binding ItemsSource}"/> 
       </Flyout> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="local:ListFlyoutButton"> 
        <Grid x:Name="RootGrid" Background="{TemplateBinding Background}"> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"> 
            <Storyboard> 
             <PointerUpThemeAnimation Storyboard.TargetName="RootGrid" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="PointerOver"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="Background"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBackgroundPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <PointerUpThemeAnimation Storyboard.TargetName="RootGrid" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Pressed"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="Background"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBackgroundPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <PointerDownThemeAnimation Storyboard.TargetName="RootGrid" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="Background"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBackgroundDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="BorderBrush"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonBorderBrushDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ButtonForegroundDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <ContentPresenter x:Name="ContentPresenter" 
           BorderBrush="{TemplateBinding BorderBrush}" 
           BorderThickness="{TemplateBinding BorderThickness}" 
           Content="{TemplateBinding Content}" 
           ContentTransitions="{TemplateBinding ContentTransitions}" 
           ContentTemplate="{TemplateBinding ContentTemplate}" 
           Padding="{TemplateBinding Padding}" 
           HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
           VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" 
           AutomationProperties.AccessibilityView="Raw" /> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</ResourceDictionary>

MainPage.xamlを

<local:ListFlyoutButton Content="Button" ItemsSource="{Binding Items}"/>

MainPage.xaml.cs

public sealed partial class MainPage : Page 
{ 
    public MainPage() 
    { 
     this.InitializeComponent(); 
     DataContext = new 
     { 
      Items = new[] { "Apple", "Banana" }, 
     }; 
    } 
}

我々は全体のデフォルトのボタンのスタイルを複製する必要はありませんでした場合、それはいいだろう。

出典

2016-11-05 01:19:31

 関連する問題

  • 関連する問題はありません^_^