How can I make a Button with multiple content values?

Question

My goal is to make a Button that has two Content values.

Imagine a Scrabble tile as a button: it has the large letter in the center and a small number in the lower right. This is the effect I am going for.

I made a button that has two ContentPresenter objects in it, and I have given each of the ContentPresenters a different style. However, I have not found a way to give each of the presenters a separate value (ie, if I set the Content of the button to "X" then both ContentPresenters show "X", albeit in different styles).

How can I achieve my objective? I'm guessing my approach is completely wrong....

Answer 1

Bah... I think I know what to do now. I should be making my own control rather than modifying a Button. This would have been obvious to me had I been working in WinForms, but for some reason all this Xaml is making me stupid.

Answer 2

Take a look at the Expander sample ControlTemplate at http://msdn.microsoft.com/en-us/library/ms753296.aspx

Expander is a subclass of HeaderedContentControl, it has two "contents": Header and Content

The control template has two ContentPresenter elements, the ContentPresenter that is not bound to the default content property is defined as:

<ContentPresenter ContentSource="Header" />

If you need to use a Button and you don't want to add another property for the second content you can use an attached property and data bind the second ContentPresnter Content property to it.

Answer 3

I delaled with creating UserControl with multiple 'content slots' here - it's better than deriving from HeaderedControl as you aren't limited in the number of slots.

Sample usage:

<Window x:Class="TkMVVMContainersSample.Services.TaskEditDialog.ItemEditView"
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 xmlns:Common="clr-namespace:TkMVVMContainersSample.Views.Common"
 Title="ItemEditView"
 >
 <Common:DialogControl>
  <Common:DialogControl.Heading>
   <!-- Heading string goes here -->
  </Common:DialogControl.Heading>
  <Common:DialogControl.Control>
   <!-- Concrete dialog's content goes here -->
  </Common:DialogControl.Control>
  <Common:DialogControl.Buttons>
   <!-- Concrete dialog's buttons go here -->
  </Common:DialogControl.Buttons>
 </Common:DialogControl>

</Window>