ribbon - Align WPF RibbonTextBox Problems -

ribbon - Align WPF RibbonTextBox Problems -

i creating interface in using ribbon command faced problem. screenshots below explain it.

the xaml markup such.

<ribbon:ribbongroup x:name="pso2" header="data entry section"> <ribbon:ribbontextbox label="x1_min" smallimagesource="images/document.png" textboxwidth="50"/> <ribbon:ribbontextbox label="x1_max" smallimagesource="images/document.png" textboxwidth="50"/> <ribbon:ribbontextbox label="x2_min" smallimagesource="images/document.png" textboxwidth="50"/> <ribbon:ribbontextbox label="x2_max" smallimagesource="images/document.png" textboxwidth="50"/> <ribbon:ribbontextbox label="iterations" smallimagesource="images/document.png" textboxwidth="50"/>

i wanted textboxes aligned no matter whatever did didn't align. setting or un-seeting textboxwidth property didn't help either. solutions? sorry have <10 reputations couldn't post image directly. help.

it little hacky, solution found forget trying align elements using ribbon element alignment controls straight , align elements using grid within ribbongroup

the first challenge grid doesn't align within ribbon group, solved binding width of grid width of ribbon group, resized ribbon grouping gets resized.

the 2nd aligning labels since label part of ribbontextbox control. solution there utilize command provide text label (label or textblock) , leave ribbontextbox.label blank.

<ribbongroup x:name="pso2" header="data entry section" width="270"> <grid width="{binding elementname=pso2, path=actualwidth}" > <grid.columndefinitions> <columndefinition width="auto" /> <columndefinition width="auto" /> <columndefinition width="auto" /> <columndefinition width="auto" /> </grid.columndefinitions> <grid.rowdefinitions> <rowdefinition height="auto" /> <rowdefinition height="auto" /> <rowdefinition height="auto" /> </grid.rowdefinitions> <textblock text="x1_min" grid.column="0" grid.row="0" /> <ribbontextbox label="" smallimagesource="images/document.png" textboxwidth="50" grid.column="1" grid.row="0"/> <textblock text="x1_max" grid.column="0" grid.row="1" /> <ribbontextbox label="" smallimagesource="images/document.png" textboxwidth="50" grid.column="1" grid.row="1"/> <textblock text="x2_min" grid.column="0" grid.row="2" /> <ribbontextbox label="" smallimagesource="images/document.png" textboxwidth="50" grid.column="1" grid.row="2"/> <textblock text="x2_max" grid.column="2" grid.row="0" /> <ribbontextbox label="" smallimagesource="images/document.png" textboxwidth="50" grid.column="3" grid.row="0"/> <textblock text="iterations" grid.column="2" grid.row="1" /> <ribbontextbox label="" smallimagesource="images/document.png" textboxwidth="50" grid.column="3" grid.row="1"/> </grid> </ribbongroup>

and using this, end ribbongroup looks like

the biggest limitation ribbontextbox's image going misplaced between label , text box. overcome this, have add together column set , set icon in there instead of using ribbontextbox.smallimagesource

wpf ribbon