2015-04-09 2 views
0

мне нужно иметь много различных кнопок, как это:Каков наилучший способ реализовать свой контроль

<Button Style="{StaticResource DetailSectionButton}" Click="Button_Click_5"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 

     <Image Grid.Column="0" Stretch="None" 
          Margin="0 0 10 0" 
          Source="../Assets/icons/info.png" /> 
     <TextBlock Text="info" Grid.Column="1" 
            Margin="0 10 0 0" /> 
    </Grid> 
</Button> 

Каждая кнопка имеет свой собственный Image.Source, TextBlock.Text и Button.Click обработчик событий.

Какой способ реализовать эту кнопку, если все, что я хочу использовать эту кнопку что-то вроде этого:

<MyButton ImageSource="../Assets/icons/info.png" Text="info" Click="Button_Click_5" /> 

Мне нужно создать UserControl или будет достаточно, чтобы использовать некоторый шаблон или Прикрепленный ли имущество ?

+1

Когда вы хотите чтобы иметь свойство ImageSource в вашей Button, вы обычно создаете настраиваемый элемент управления, который происходит от Button, и добавьте ImageSource свойство зависимостей, которое используется в стиле пользовательского элемента управления (в Generic.xaml). Альтернативой может быть добавление Setter для свойства «Template» в стиле «DetailSectionButton» с помощью ControlTemplate, который использует свойство «Tag» Button для «Image.Source». – Clemens

ответ

1

Я вижу, по крайней мере, 2 способа сделать это.

Прежде всего, это наследование от Button, расширение его с помощью свойства Dependency ImageSource и привязка к нему внутри DataTemplate.

Другим способ сделать это состоит в создании ImageSource придает свойству, и привязать к нему внутри DataTemplate, как показано ниже:

public class Config 
{ 
    public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.RegisterAttached(
     "ImageSource", typeof (ImageSource), typeof (Config), new PropertyMetadata(default(ImageSource))); 

    public static void SetImageSource(DependencyObject element, ImageSource value) 
    { 
     element.SetValue(ImageSourceProperty, value); 
    } 

    public static ImageSource GetImageSource(DependencyObject element) 
    { 
     return (ImageSource) element.GetValue(ImageSourceProperty); 
    } 
} 

Вот шаблон и кнопка данные:

<DataTemplate x:Key="ButtonTemplate"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto" /> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
     <Image Grid.Column="0" 
       Source="{Binding Path=(s:Config.ImageSource), 
           RelativeSource={RelativeSource AncestorType=Button}}" 
       Stretch="None" /> 
     <TextBlock Grid.Column="1" 
        Margin="0 10 0 0" 
        Text="{Binding}" /> 
    </Grid> 
</DataTemplate> 

<Button Click="Button_Click_5" 
     Content="Info" 
     ContentTemplate="{StaticResource ButtonTemplate}" 
     s:Config.ImageSource="media_stop_red.png" /> 

Надеется, что это помогает ,

EDIT

Просто расширить кнопки управления со свойством ImageSource зависимости и создать стиль по умолчанию для него, как показано ниже:

public class MyButton : Button 
{ 
    public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.Register(
     "ImageSource", typeof (ImageSource), typeof (MyButton), new PropertyMetadata(default(ImageSource))); 

    public ImageSource ImageSource 
    { 
     get { return (ImageSource) GetValue(ImageSourceProperty); } 
     set { SetValue(ImageSourceProperty, value); } 
    } 

    public MyButton() 
    { 
     DefaultStyleKey = typeof (MyButton); 
    } 
} 

Стиль и самой кнопки:

<Style TargetType="s:MyButton"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="s:MyButton"> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="*" /> 
         </Grid.ColumnDefinitions> 
         <Image Grid.Column="0" 
           Source="{TemplateBinding ImageSource}" 
           Stretch="None" /> 
         <TextBlock Grid.Column="1" 
            Margin="0 10 0 0" 
            Text="{Binding}" /> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

    <s:MyButton Content="Info" ImageSource="..\media_stop_red.png" /> 
+1

Спасибо. Но у меня нет AncestorType. Это код для Windows 8.1 XAML? Если это не так, какова альтернатива? – demas

+0

Я скучаю, что это окна 8.1, поэтому я не предсказываю отсутствие AncestorType. В этом случае вам нужно использовать вариант из моего ответа. Я собираюсь отредактировать свой ответ с этим подходом. – nrudnyk

+0

Большое спасибо. Что это означает: 'в TargetType? Является ли это пространством имен класса MyButton? Мне нужно написать «TargetType =« MyNamespace: MyButton »? – demas

0

Создайте новый usercontrol, у него есть xaml и код позади. Теперь изменение в xaml usercontrol на Button и в коде позади изменяет унаследованную клазу с usercontrol на Button тоже.

Теперь добавьте contenet кнопки

Затем добавьте свойство зависимостей с событием, установите значение для управления

Смежные вопросы