调整自己的用户控件的大小

本文关键字:控件 自己的 用户 调整 | 更新日期: 2023-09-27 18:32:39

我正在创建一个Windows Phone应用程序,我使用自己的UserControl

<UserControl x:Class="TestApp.Negyzet"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    Width="100" Height="100">
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Rectangle x:Name="Kitoltoszin" Stroke="White" Width="100" Height="100" StrokeThickness="3" RadiusX="10" RadiusY="10" HorizontalAlignment="Center" VerticalAlignment="Center">
            <Rectangle.Fill>
                <SolidColorBrush Color="Gray"/>
            </Rectangle.Fill>
        </Rectangle>
        <TextBlock  x:Name="Betu" Width="70" Height="70" 
                FontWeight="Bold" FontSize="42" Foreground="White" 
                HorizontalAlignment="Center" VerticalAlignment="Center" TextAlignment="Center" />
    </Grid>
</UserControl>

有窗口,我在其中动态生成控件,Grid

<Grid Grid.Row="3" VerticalAlignment="Center" HorizontalAlignment="Center" x:Name="NegyzetGrid" Background="Transparent">
</Grid>

生成:

for (int i = 0; i < width; i++)
{
    ColumnDefinition col = new ColumnDefinition();
    //NegyzetGrid: where I have to generate the Controls
    NegyzetGrid.ColumnDefinitions.Add(col);
    RowDefinition row = new RowDefinition();
    NegyzetGrid.RowDefinitions.Add(row);
    for (int j = 0; j < height; j++)
    {
        palya[i, j] = new Negyzet();
        palya[i, j].IsHitTestVisible = false;
        Grid.SetRow(palya[i, j], i);
        Grid.SetColumn(palya[i, j], j);
        NegyzetGrid.Children.Add(palya[i, j]);
    }
}

根据用户的选择,我必须生成 3x3、4x4 或 5x5 项。我想创建一个多分辨率应用,并且我想自动调整自己的控件大小以填充整个屏幕,并且每个控件的大小必须相同。(例如,如果我有一个 900 像素宽的屏幕,并且用户选择 3x3,则项目宽度必须为 300,如果是 4x4,则为 225,依此类推。

如何设置这样的大小?

调整自己的用户控件的大小

我认为您需要在窗口中像这样设置水平对齐和垂直对齐。通过这样做,您的网格将占用所有可用空间:

<Grid Grid.Row="3" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" x:Name="NegyzetGrid" Background="Transparent">
</Grid>

然后在用户控件中删除 UserControl 声明中的宽度和高度,并将矩形上的垂直对齐和水平对齐属性设置为拉伸,这应该可以解决问题! :

<UserControl x:Class="ST1.Negyzet"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<Grid x:Name="LayoutRoot" Background="Transparent">
    <Rectangle x:Name="Kitoltoszin" Stroke="White" StrokeThickness="3" RadiusX="10" RadiusY="10" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
        <Rectangle.Fill>
            <SolidColorBrush Color="Gray"/>
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock  x:Name="Betu" Width="70" Height="70" 
               FontWeight="Bold" FontSize="42" Foreground="White" 
               HorizontalAlignment="Center" VerticalAlignment="Center" TextAlignment="Center" />
</Grid>