在Xamarin表单中将按钮与图像和文本一起使用

Question

我是Xamarin表单的新手，并有一个基本问题，以找出在Xamarin表单中使用带有图像和文本的按钮的最佳方法。

任务是设计一个具有如下按钮布局的主页：

我能够使用Buttons和StackLayout完成此布局。我使用Button的ContentLayout属性设置对齐方式（例如）：

1. ContentLayout =“对， 80 ”
2. ContentLayout =“对， 25 ”
3. ContentLayout =“对， 100 ”
4. ContentLayout =“对， 10 ”

这样，图像就向右移动，并且间距定义了文本和图像之间的空间。我必须为似乎错误的每个按钮设置不同的间距。我没有找到任何更好的方法将Text设置为左对齐，并且默认情况下似乎居中对齐。

是否有Button的任何属性，可用于使按钮文本左对齐。或者采用这种基本设计的更好的方法是什么。

Answer 1

我认为按钮没有其他方法，但是在您的情况下，我建议您使用StackLayout 而无需使用按钮中的ContentLayout属性，因为您始终需要在按钮上显示按钮非常结束。

 <StackLayout Orientation="Vertical">
                <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Padding="10">
                    <Label Text="Small Text" HorizontalOptions="StartAndExpand" VerticalOptions="CenterAndExpand"/>
                    <Image Source="image.png" HorizontalOptions="EndAndExpand" VerticalOptions="CenterAndExpand"/>
                </StackLayout>
                <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Padding="10">
                    <Label Text="This is large text" HorizontalOptions="StartAndExpand" VerticalOptions="CenterAndExpand"/>
                    <Image Source="image.png" HorizontalOptions="EndAndExpand" VerticalOptions="CenterAndExpand"/>
                </StackLayout>
            </StackLayout>