c# - Why can't I put this grid on my button? -

i need buttons have several pieces of text on them in specific layout, i'm trying put grid on button organize info.

my problem while can unmodified button appear, grid never appears in or on top of it.

here's .xaml code:

<!-- ...other code above... -->  <itemscontrol x:name="btnlist">     <itemscontrol.itemtemplate>         <datatemplate>             <grid background="green">                 <grid.rowdefinitions>                     <rowdefinition height="3*" />                     <rowdefinition height="2*" />                 </grid.rowdefinitions>                 <grid.columndefinitions>                     <columndefinition width="1*" />                     <columndefinition width="1*" />                     <columndefinition width="1*" />                 </grid.columndefinitions>                 <textblock grid.columnspan="3"                            grid.row="0"                            grid.column="0"                            horizontalalignment="center"                            margin="15"                            text="test text 1" />                  <textblock grid.row="1"                            grid.column="0"                            horizontalalignment="center"                            text="test text 2" />                  <textblock grid.row="1"                            grid.column="1"                            horizontalalignment="center"                            text="test text 3" />                  <textblock grid.row="1"                            grid.column="2"                            horizontalalignment="center"                            text="test text 4" />             </grid>         </datatemplate>     </itemscontrol.itemtemplate> </itemscontrol> 

here's associated .xaml.cs code:

    public thingselectflyout()     {         this.initializecomponent();          foreach (xthing_indexitem indexitem in datastore.instance.thingsfoundontap)         {             button button = new button()             {                 name = indexitem.cguid.tostring("n"),                 content = indexitem.cname,                 style = application.current.resources["bigbuttons"] style             };             button.click += thingbutton_click;             btnlist.items.add(button);         } 

when run buttons appear (with default background color, blue) , have content that's given them in .xaml.c file.

as side note, modifying else's code , long story short cannot move entire button construction .xaml file; many other things expect there.

bind itemscontrol list belonging viewmodel:

<itemscontrol x:name="btnlist"  itemssource="{binding items}">    <itemscontrol.itemtemplate>       <datatemplate>         <button>            <button.content>                   <!-- place grid xaml here -->            </button.content>        </button>     </datatemplate>   </itemscontrol.itemtemplate> </itemscontrol> 

add observablecollection viewmodel, collection list of datastore.instance.thingsfoundontap type.

so in viewmodel, add new instance property:

private observablecollection<yourtype> _items = new observablecollection<yourtype>();  public observablecollection<yourtype> items {     get{ return _items; } } 

then modify view adding viewmodel, notice must set views datacontext view model:

var viewmodel = new yourviewmodel();  //create view model datacontext = viewmodel;   // set views datacontext  foreach (xthing_indexitem indexitem in datastore.instance.thingsfoundontap) {    viewmodel.items.add( indexitem); } 

finally, modify view bind single item in viewmodels items collection:

 <textblock grid.row="1"     grid.column="0"     horizontalalignment="center"     text="{bind cname}" /> 

you can handle click event or command whichever way want.