Hi guys. I need to place 4 buttons in horizontal orientation, but I can't show all of them, why?
I attach an image.
@Laura83 - can you post your code?
I tried but I don't know why it doesn't appear.
I attach also the code -_-
@Laura38 - I'd be tempted to specify a background color so that you can see the actual size of the buttons. If they are far bigger than are required for the contained images, consider using WidthRequest, or contain them in a Grid rather than StackLayout. If you want the four buttons evenly spaced across the page, Grid is probably more appropriate.
Also, what is the StackLayout contained in? Could it be that the StackLayout has a Width greater than the screen?
Try setting StackLayout.Spacing (or Space... I don't remember)
Scale property scale only the image, not the button size. I usually use a Image with a TapGestureRecognizer...
@JohnHardman thank you so much for your reply.
I follow your suggestion and as you can see the buttons are small. There's something a padding/margin between them or what?
The StackLayout is contained in another one (without specified properties) and finally in the contentpage.
@laura83 - Interesting. I'd try Spacing = 0 and Padding = 0, and remove the AndExpand off the containing StackLayout, as part of investigation
Thank you @JohnHardman and @AlessandroCaliaro
As you can suggest, I set spacing and padding at 0, specified Center instead CenterAndExpand and I can see the last button but not completely. It seems to be in a larger container that I don't know.
I also valuate to use an Image with TapGestureRecognizer
@Laura83 - we'd need to see more of the code to identify exactly what is going on.
However, if you are after evenly spaced buttons, I would suggest using a 4x1 Grid rather than StackLayout.
I would stick with something that has Button behaviors, even if you don't use ImageButton, rather than using an Image with TapGestureRecognizer. If you use Image with TapGestureRecognizer, any users with physical keyboards, or who use particular accessibility software, may not be able to tap the images. I use an implementation based on a content button for this. The code that I originally based mine on can be found at https://mega.nz/#!sd5XiRbT!70f-0VOqlwh_eIhwolktKeswbZPM9pLmRhYiMjkl0Ms
All I written is (see attach image and otherwise... why my text code isn't visible on the forum?)
I after used grid instead stacklayout and the result doesn't totally satisfactory
@laura83 - the XAML doesn't always appear (nor does generic C#) as the Markdown stuff interprets chevrons in a particular way.
Are your images always the same size? If so, use WidthRequest on the buttons. I wouldn't personally use Scale for this. I use WidthRequest=60 and HeightRequest=44 for buttons that I use in a similar way.
For sake of completeness, set Margin=0 as well
I have done this test
with this code
ContentPage cp = new ContentPage ();
StackLayout sl = new StackLayout ();
sl.Orientation = StackOrientation.Horizontal;
Button b1 = new Button ();
b1.Image = "icon.png";
b1.VerticalOptions = LayoutOptions.Start;
Button b2 = new Button ();
b2.Image = "icon.png";
b2.VerticalOptions = LayoutOptions.Start;
Button b3 = new Button ();
b3.Image = "icon.png";
b3.VerticalOptions = LayoutOptions.Start;
Button b4 = new Button ();
b4.Image = "icon.png";
b4.VerticalOptions = LayoutOptions.Start;
cp.Content = sl;
MainPage = cp;
@JohnHardman there is no Margin property. @AlessandroCaliaro I can't see your attach image but anyway, I'll try your code and still not work as I want.
@laura83 - What version of Xamarin.Forms are you using? The latest stable release has a Margin property on Buttons.
this is the image
https://www.dropbox.com/s/m6f7zf3a8o77ho8/Screenshot 2016-06-16 18.55.48.png?dl=0
it seems good
I don't know why but on my screen isn't the same.
We are speaking of Android?....
what do you see with my code?
@laura83 - just to clarify, what version of the Xamarin.Forms NuGet package have you got installed? The latest stable version has just gone up from 220.127.116.11 to 18.104.22.168, but if you don't have a Margin property you are using something older than 22.214.171.124
@JohnHardman right, I'm using 126.96.36.199 -_-"
@AlessandroCaliaro Cleaning and build again, it works! THANKS! XD what was the problem??
@AlessandroCaliaro wait a moment: the problem persists if I use a smaller screen, obviously... -_-
last XF is 2.2....
@AlessandroCaliaro - the 4.0 @laura83 mentioned is presumably the version of Xamarin for Visual Studio. @laura83 is using 188.8.131.52 of Xamarin.Forms. They are on different release cycles I think.
Use Grid with one row and four columns
Got the same problem. On Android there is ALWAYS a little padding (spacing) between multiple horizontal buttons. Using grid instead of stackLayout does not help at all.
Xamarin Inc., as a wholly-owned Microsoft subsidiary acting as a separate legal entity, adheres to the Microsoft Privacy Statement: Privacy & cookies