This project is read-only.

Button with Picture and Text

Aug 19, 2010 at 1:43 PM

Hello everyone,

To my shame, it was late yesterday. I dont get anything done today, but i really need to get a Picture on a button in Addition to the Text.

( [Img] TextTextText )   <= Sample

Can someone give me a code snippet for this? I thought about Button.Content += Image but it would not be Located on the right side. Another thought was about adding an Picture Box to the Button. Like i said it was quite late -.-

Would be great if someone got a snippet there for me to use. 

Thanks a lot,


@Tom: I know its possible quite least usually i know, but sadly not at the moment. 





Aug 19, 2010 at 5:33 PM
Edited Aug 20, 2010 at 1:38 AM

it's not that easy, but it's possible.

Content is actually of type Shape. Shape has some implict operators which convert strings and textures to shapes. That's why you can use Button.Content = "Text" instead of Button.Content = new StringShape("Text") btw.


To have a string AND an image, you need a MultiShape:

multiShape = new MultiShape();
multiShape.Add(new StringShape("Text"));
multiShape.Add(new ImageShape(texture));
Button.Content = multiShape;

But that would center both. So you must create a derived MultiShape which layouts both at an overload on the Size property of MultiShape.


I think the "Content +=" is a good idea!
In one of the next releases, I'll add a new HorizontalStackShapeGroup that makes it so and a Shape operator for the += syntax.

Aug 23, 2010 at 8:37 PM

Hello Tom

please give us am imagebutton control with both image and text content-

your framework is wonderfull but this kind of control is missed.

best regards

Aug 24, 2010 at 3:37 AM

it's now possible:


            Button button = new Button
                Bounds = new Rectangle(48, 300, 320, 80),
                Color = PhoneColors.Dark,
                // Content = new StackShape(SysImages.RecycleBin, "Recycle"),
            button.Content = SysImages.RecycleBin;
            button.Content += "Recycle";
 now you can set a content with one ore more shapes.

Aug 24, 2010 at 6:08 AM


Aug 24, 2010 at 6:19 AM


one more thing how can i align/position the 2 content inside button bounds?

for each content i have a position properties or an alignment methods?

best regards

Aug 24, 2010 at 1:15 PM


i have tryed something like this but does not work for me.

i want to put an image as backround of button and over it a string

Shape a is the image , Shape b is the string.



Shape b = "SMS";


a.Location = new Point(0, 0);


b.Location = new Point(90, 90);


b.Size = new Size(50, 50);

Shape a = ImageResource.TileTxT;

btn1.Content = a;


btn1.Content = b;

Aug 24, 2010 at 1:37 PM
Edited Aug 24, 2010 at 1:41 PM

must be

btn1.Content = a;
btn1.Content += b;

Shape.Location is not supported in the StackShape, since the location is calculated automatically. Currently, it's a left from right alignment only, but will be expanded to do top to bottom alignnments as well.

Aug 24, 2010 at 2:24 PM


as describe before i need to make an image a button with an image as background and a txt in a particular position of button bounds.

there is a way to obtain it?

best regards

Aug 26, 2010 at 1:07 AM

There is a new CanvasShape which can do that.

Aug 26, 2010 at 11:33 AM


there is an example in your demos? or you can give use one?



Aug 26, 2010 at 11:39 AM

Hello Tom,


thank you so much for your developments in the last few days! They are great and nice to use. Sadly there are too much changes to merge my active Project right now. But im looking forward to it. My first experiments with your updates were a lot of fun already, especially your new Shapes and the Pages.


Thanks a lot!


Aug 26, 2010 at 12:54 PM


i have tryed by myself your new CanvasShape.......................NICE...NICE ..........NICE .........That's wht i need.

I share my code to all other interested in this.

 Button btn1 = new Button 


Bounds =new Rectangle(50, 50, 160, 160),

Color =PhoneColors.Blue,


CanvasShape cs = new CanvasShape();

cs.Size =new Size(160, 160);

cs.Location =new Point(0, 0);


Shape b = "SMS";

Shape a = ImageResource.TileTxT;

a.Location =new Point(0, 0);

b.Location =new Point(90, 90);

b.Size =new Size(100, 100);



btn1.Content = cs;