2010-04-28 9 views
9

Я хочу создать кнопки с изображениями и текстом внутри. Например, я бы использовал разные изображения и текст для таких кнопок, как «Обзор папок» и «Импорт». Одним из вариантов было бы использовать шаблон. я имел взгляд на simliar вопросШаблон кнопки с изображением и текстом в wpf

Creating an image+text button with a control template?

Но есть ли способ, с помощью которого я могу связать источник изображения без использования свойства зависимостей или любого другого класса?

Благодаря

ответ

4

Нет. Что бы вы связать Image.Source к? Для этого вам нужен DependencyProperty. Конечно, вы также можете определить нормальный класс, который содержит два свойства: Text и ImageSource или Uri, а затем использовать DataTemplate для визуализации экземпляров этого класса, но это будет еще больше кода для записи, и это немного «вонючий» ».

По какой причине вы не хотите использовать свойство зависимости или пользовательский класс?

+0

Единственная причина в том, что я хотел знать, есть ли какой-либо другой простой способ, или вы можете сказать, что это скорее «меньше кода». С texblock я могу использовать Я хотел знать, почему я не могу сделать то же самое с исходным свойством изображения? – Archie

+0

Но где ** вы бы положили это 'TemplateBinding'? И к **, какое свойство ** вы бы связали? – gehho

+0

Могу ли я использовать свойство «Tag», чтобы связать его? – Archie

36

Это не должно быть так сложно. Что-то же просто, как положить StackPanel внутри кнопки будет делать трюк:

<Button> 
    <StackPanel> 
    <TextBlock>My text here</TextBlock> 
    <Image Source="some.jpg" Stretch="None" /> 
    </StackPanel> 
</Button> 

Затем вы можете настроить StackPanel для управления, где должен появиться текст, выравнивание и т.д.

+0

Хорошо, но как вы устанавливаете символ подчеркивания? Если я помещаю здесь «_My text», он отображает подчеркивание, а alt + M больше не работает. Итак, как вы это получите? – BrainSlugs83

+0

Также, как вы можете уменьшить изображение, чтобы кнопка не взорвалась до размера вашего изображения (т. Е. Если у меня есть изображение 40x40 и кнопка любых кнопок размера - я не хочу чтобы вручную установить это - как мне получить изображение, чтобы сжиматься до нужного размера, а не взорвать мою кнопку, чтобы быть большим? – BrainSlugs83

+0

Я хотел бы добавить, что вы, вероятно, захотите установить 'Orientation'' StackPanel' в 'Horizontal', чтобы они выстроились рядом друг с другом. Обратите внимание: если вы использовали сетку вместо StackPanel, вам придется играть с полями, чтобы центрировать изображение и текст на кнопке по горизонтали (так что стековая панель - это путь). –

13

я добавил несколько вещей выстроить их красиво

<Button> 
    <StackPanel Orientation="Horizontal"> 
     <Image Source="/ApplicationName;component/Images/MyImage.ico"/> 
     <Label Padding="0">My Button Text</Label> 
    </StackPanel> 
</Button> 
+0

Ну, это сработало, чтобы дать мне обычную ярлык кнопки (т. Е. С горячими клавишами Alt + Letter). Я протестировал его, нажав кнопку, когда я нажимаю правильную комбинацию. - Теперь мне просто нужно выяснить, как уменьшить изображение до размера кнопки и не заставлять его делать все кнопки огромными. – BrainSlugs83

6
<Button> 
     <StackPanel Orientation="Horizontal"> 
      <Image Source="Resources/add.png" Stretch="None" /> 
      <TextBlock Margin="5,0,0,0">Add</TextBlock> 
     </StackPanel> 
    </Button> 
4
<Button x:Name="MyCoolButton"Width="200" Height="75"> 
<Grid > 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 
    <Image Source="Pete-Brown-Silverlight-in-Action.png" Margin="5" Grid.Column="0" /> 
    <StackPanel Grid.Column="1" Margin="5"> 
     <TextBlock Text="Buy My Book!" FontWeight="Bold" /> 
     <TextBlock Text="Pete is writing THE Silverlight 4 book" TextWrapping="Wrap" /> 
    </StackPanel> 
</Grid> 

0

Добавлен Stretch = "Uniform" Ответ Шона на адрес, если изображение изначально больше размера кнопки (вопрос BrainSlugs83 упоминается в его комментариях, в которые я столкнулся). Более подробная информация о вариантах растяжки: MSDN.

<Button> 
    <StackPanel Orientation="Horizontal"> 
     <Image Source="/ApplicationName;component/Images/MyImage.ico" Stretch="Uniform"/> 
     <Label Padding="0">My Button Text</Label> 
    </StackPanel> 
</Button> 

Хотел добавить это в качестве комментария к ответу под BrainSlugs83, но пока не может из-за отсутствие пунктов и был отклонен от редактирования ответа Шона.

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