Button Image Layout

Button Image Layout

• Randine

  Hi Flavelle,

  Thanks for your detailed information about your scenraio and your concern.
  Now I fully understand your scenario that you want to assign a Image to the button, and you want both Zoom and Alignment feature for the Image. But now the Image or BackgroudImage only provided half funtionality.

  If I misunderstood, please feel free let me know.

  So far I think the workaround is to use the Image property which has the Alignment property. But we need to Zoom the Image first before we assign it to the Image property.

  Here is link for your reference about how to Zoom an Bitmap.
  How to: Create a Zoom Effect
  http://msdn2.microsoft.com/en-us/library/ms229648(VS.80).aspx

  I do understand your concern in this scenario, I highly suggest you can
  submit this feedback to our product feedback center:
  http://lab.msdn.microsoft.com/productfeedback/default.aspx

  Thanks for your understanding!

  If you still have any concern, please feel free to post here.

  Best regards,
  Peter Huang

  
  
  

• Steve Teixeira

  Peter:

  Submitted suggestion to Microsoft, using your link.

  Many thanks,

  Flavelle

  
  

• tekvaio

  Hi Flavelle,

  Sorry, but I don't understand your problem.

  If you set the image, the only problem is that the text appears over the image, but that problem is very simple to solve: Using "carry return"'s before the text we will obtain the wished text position, no

  You can explain the problem with more detail

  Thanks!

  
  

• Prakash Srinivasan

  Toni:

  The image is a large image.

  If I set the button to use the image as a background, then I can use the BackImage.Layout property to specify Zoom, which means that the image that appears on the button will be the 'right size' to show on the button. However, the text does not format correctly in that if I resize the button, then the text will go over top of the button.

  If I set the button to use the image as an image, there is no Layout property that will allow me to specify Zoom, in which case, all I see is part of the image.

  The only workaround is to have a version of the image that is the 'right size' to use as a foreground image, which is a pain!

  Don't know if you have any ideas, but if you do, then your suggestion would be most welcome.

  thanks,

  Flavelle

  
  

• tspratt

  Hi,

  I did not understand your scenario very much.
  But I think you may to check the Button's TextAlign property= MiddleCenter so that the text will keep in the middle and center of the button.
  And the TextImageRelation property = TextAboveImage which will force the Text over the Image.

  If I misunderstood, can you provide more information about the problem and your concern

  If you still have any concern, please feel free to post here.

  Best regards,
  Peter Huang

  
  
  

• IronYuppie

  Dear All:

  I hope that the following provides enough information to reproduce the problem. If not, please let me know.

  1. Find two image files - one about 80 pixels wide, the second much larger. I am using graphics of flags, which tend to be large, but I manually resized one to be 80 pixels wide.
  2. Create a new Windows Form Solution. This will open a Form in designer called Form1.
  3. Drag a Button from the Toolbox to the form - we will be working with this button.
  4. Open the properties for the Button - we will be working with the properties.
  5. Resize the button so that it is approximately 85 pixels wide.
  6. Change the TextAlign property to Bottom Center.
  7. Change the ImageAlign property to Top Center.
  8. Import both Images (step 1) into the Resource file. To do this:
  1. In the Properties window for the button, select the elipsis (...) beside the Image.
  2. Select the Project Resources radio button, then select Import.
  3. Find the two images, using the browse, then select OK. Both images should now be listed.
  4. Select the smaller image first, then click OK. This will return you to the Property Window for the Button. The Image that you selected should now be listed in Image and showing on the button.
  9. Resize the button - as you resize, note what happens to the text and the image. You should be able to resize the button so that the image is fully displayed and the text appears below it.
  10. Now change the Image property so that you are using the larger image. Note that you see only a portion of the image in the button.
  11. Now clear the image from the button by deleting the name in the Image property. The text in the button should appear at the bottom and the rest of the button should be empty.
  12. In the BackgroundImage property, select the large graphic. Note that you see only a small portion of the graphic with the text overtop.
  13. Select the BackgroundImageLayout property and change it to Zoom.
  14. The entire image can now be seen, but there is no way to put it to the Top Center.

  The problem is:

  1. I would like to be able to use the large graphics.
  2. Using the Background Image won't work - can't set it so that it aligns Top Center.
  3. Can't use the large graphic in the Image - no way to set a layout property so that it will Zoom.

  Workaround:

  1. I will need to manually resize all of the graphics that I want to use so that they are approximately 80 pixels wide. That is a lot of tedious work.

  Ultimate Solution (request to Microsoft):

  1. Add an ImageLayout property, similar to the BackgroundImageLayout property, that would allow large graphics to be displayed in a small button.

  For now, I will have to use the Workaround.

  Best regards,

  Flavelle

  
  
• Button Image Layout