简体   繁体   中英

How to set image height on a button in Xamarin.Forms

Click here to see the desired design

I want a footer structure like above (desired design) in my application which has two button with 50% width and fb and google image on it. But i can not set the height of the image. Please help me out

Here is my tried code

<StackLayout>
        <StackLayout Orientation="Horizontal" VerticalOptions="Start">
            <!-- top controls -->
        </StackLayout>

        <StackLayout VerticalOptions="CenterAndExpand">
            <!-- middle controls -->
        </StackLayout>

        <StackLayout Orientation="Horizontal" VerticalOptions="End">
            <StackLayout Orientation="Horizontal"  HorizontalOptions="FillAndExpand">
                <StackLayout Orientation="Vertical"  HorizontalOptions="FillAndExpand">
                    <Button Text="Has Image" Image="drawable/fb_btn.png"/>
                </StackLayout>
                <StackLayout Orientation="Vertical"  HorizontalOptions="FillAndExpand">
                    <Button Text="Sign Up"/>
                </StackLayout>
            </StackLayout>
        </StackLayout>
    </StackLayout>

You can add a HeightRequest in your code like that:

XAML

<StackLayout Orientation="Vertical"  HorizontalOptions="FillAndExpand">
                <Button Name="imageBtn" Text="Has Image" Image="drawable/fb_btn.png" 
                  HeightRequest="56"/>
 </StackLayout>

More info:

1,Your code contain StackLayout ,it also can modify the result.

2,If you want more control over the image size and placement,you can add a tap gesture recognizer to it.

.CS

TapGestureRecognizer tapEvent = new TapGestureRecognizer();
tapEvent.Tapped += Button_Clicked;
imageBtn.GestureRecognizers.Add(tapEvent);

workaround

1.You can use Image control with a tapgesture:

XAML

<Image x:Name="myImage" Source="myPicture.png" HeightRequest="150" WidthRequest="60" BackgroundColor="Red" HorizontalOptions="Center"/>

XAML.CS

TapGestureRecognizer tapEvent = new TapGestureRecognizer();
tapEvent.Tapped += clickedEvent;
myImage.GestureRecognizers.Add(tapEvent);

2. refer to https://github.com/XLabs/Xamarin-Forms-Labs/wiki/ImageButton

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM