Question

我有4个按钮排列在一个网格中。我希望每个按钮都显示与该按钮大小完全相同的图像，但是如何操作却无所适从。我现在正在尝试以下方法，但是在包含行时出现错误“无法设置按钮的内容，因为它没有content属性属性”。

我尝试将图像添加到网格中的第一个按钮，但是图像太大。无论我使用的手机大小如何，我都希望图像能完美覆盖按钮的大小。

这是我的代码：

<Grid>
        <Grid.RowDefinitions>
                <RowDefinition Height="30"/>
                <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
        </Grid.ColumnDefinitions>
        <Label Grid.Row="0" Grid.ColumnSpan="2" Text="Welcome," HorizontalOptions="Center" FontSize="Large" TextColor="Aqua"/>
        <Label Grid.Row="1" Grid.ColumnSpan="2" Text="User" HorizontalOptions="Center" FontSize="Large" TextColor="Aqua"/>     
        <Button Grid.Row="2" Grid.Column="0" Image="iris_light" Text="Student&#x0a;Directory" TextColor="Aqua"/>
        <Button Grid.Row="2" Grid.Column="1" Text="Executive&#x0a;Directory" TextColor="Aqua"/>
        <Button Grid.Row="3" Grid.Column="0" Text="Voting" TextColor="Aqua"/>

        <Button Grid.Row="3" Grid.Column="1" Text="Map" TextColor="Aqua">

            <Image Source="iris_light"/>

        </Button>
</Grid>

Answer 1

如果您希望这样做（表示Image属性不够灵活），则必须编写一个自定义渲染器。

与Windows不同，iOS和Android并非基于XAML，因此其控件的内容不可通过该方式进行编辑，因为基础操作系统不支持该内容。

Answer 2

解决了我的问题：

<Grid BackgroundColor="Transparent">
        <Grid.RowDefinitions>
                <RowDefinition Height="30"/>
                <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
        </Grid.ColumnDefinitions>
        <Label Grid.Row="0" Grid.ColumnSpan="2" Text="Welcome," HorizontalOptions="Center" FontSize="Large" TextColor="Aqua"/>
        <Label Grid.Row="1" Grid.ColumnSpan="2" Text="User" HorizontalOptions="Center" FontSize="Large" TextColor="Aqua"/>     
        <Image Grid.Row="2" Grid.Column="0" Source="iris_light"/>
        <Button Grid.Row="2" Grid.Column="0" BackgroundColor="Transparent" Text="Student&#x0a;Directory" TextColor="Aqua"/>
        <Image Grid.Row="2" Grid.Column="1" Source="iris_light"/>
        <Button Grid.Row="2" Grid.Column="1" BackgroundColor="Transparent" Text="Executive&#x0a;Directory" TextColor="Aqua"/>
        <Image Grid.Row="3" Grid.Column="0" Source="iris_light"/>
        <Button Grid.Row="3" Grid.Column="0" BackgroundColor="Transparent" Text="Voting" TextColor="Aqua"/>
        <Image Grid.Row="3" Grid.Column="1" Source="iris_light"/>
        <Button Grid.Row="3" Grid.Column="1" BackgroundColor="Transparent" Text="Map" TextColor="Aqua"/>
    </Grid>

在Xaml中将图像添加到按钮的背景

2 个答案: