使TabControl内部网格的宽度和高度为动态

本文关键字：高度 动态 TabControl 内部 网格 | 更新日期: 2023-09-27 18:30:03

我正在开发一个WPF应用程序。我的应用程序中有很多选项卡。每个选项卡都包含一个网格。我的应用程序是基于页面的，没有窗口。我的应用程序中有两个页面，一个是主页，Xaml就是这个主页.xaml

<Page x:Class="App.MainPage"
  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"
Title="MainPage" Height="600" Width="1000" WindowHeight="600" 
  WindowWidth="1000" WindowTitle="CSP - LOGIN" Background="Black"></Page>

和Page2.xaml

<Page x:Class="App.Page2"
          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">
<Grid Background="Black">
    <TabControl HorizontalAlignment="Left" Height="100" Margin="27,63,0,0" VerticalAlignment="Top" Width="100">
                <TabItem Header="TabItem">
                    <Grid Background="#FFE5E5E5">
<Grid HorizontalAlignment="Left" Height="410.5" Margin="10,19.54,0,0" VerticalAlignment="Top" Width="766">
<Button Content="Add Item" HorizontalAlignment="Left" Margin="10,135.748,0,0" VerticalAlignment="Top" Width="75"/>
                        <Button Content="Remove Item" HorizontalAlignment="Left" Margin="10,177.208,0,0" VerticalAlignment="Top" Width="75"/>
                        <Button Content="Update Item" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="10,217.168,0,0"/>
</Grid>
</Grid>
                </TabItem>
                <TabItem Header="TabItem">
                    <Grid Background="#FFE5E5E5">
<Grid HorizontalAlignment="Left" Height="410.5" Margin="10,19.54,0,0" VerticalAlignment="Top" Width="766">
<Button Content="Add Item" HorizontalAlignment="Left" Margin="10,135.748,0,0" VerticalAlignment="Top" Width="75"/>
                        <Button Content="Remove Item" HorizontalAlignment="Left" Margin="10,177.208,0,0" VerticalAlignment="Top" Width="75"/>
                        <Button Content="Update Item" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="10,217.168,0,0"/>
</Grid>
</Grid>
                </TabItem>
                <TabItem Header="TabItem" HorizontalAlignment="Left" Height="19.96" VerticalAlignment="Top" Width="96">
                    <Grid Background="#FFE5E5E5">
<Grid HorizontalAlignment="Left" Height="410.5" Margin="10,19.54,0,0" VerticalAlignment="Top" Width="766">
<Button Content="Add Item" HorizontalAlignment="Left" Margin="10,135.748,0,0" VerticalAlignment="Top" Width="75"/>
                        <Button Content="Remove Item" HorizontalAlignment="Left" Margin="10,177.208,0,0" VerticalAlignment="Top" Width="75"/>
                        <Button Content="Update Item" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="10,217.168,0,0"/>
</Grid>
</Grid>
                </TabItem>
            </TabControl>
</Grid>
    </Page>

正如您所看到的，每个选项卡都有两个网格。一个网格是默认生成的，另一个由我添加以将项目组合在一起。

我尝试过SizeToContent和其他函数在更改时动态获取宽度和高度，但当我添加SizeToCntent时，会出现错误，SizeToConnent不会显示在代码提示中。它给出了无法访问的错误。

我希望网格中的内容是动态的，所以如果窗口大小发生变化，大小也会发生变化。

使TabControl内部网格的宽度和高度为动态

我将解释控制属性的几个行为方面：

  • 在控件上定义Width属性会使其水平固定
  • 在控件上定义Height属性会使其垂直固定
  • 根据值的不同，在控件上定义HorizontalAlignment属性有多种行为：
    1. Stretch:默认值使控件相对于其父容器水平拉伸当设置了Width属性时，此选项无效
    2. Left：将控件在其父容器内向左对齐
    3. Center：使控件在其父容器内水平居中
    4. Right：将控件在其父容器内向右对齐
  • 在控件上定义VerticalAlignment属性有多种行为，d取决于值：
    1. Stretch:默认值使控件相对于其父容器垂直拉伸当设置了Height属性时，此选项无效
    2. Top：将控件朝其父容器内的顶部对齐
    3. Center：使控件在其父容器内垂直居中
    4. Bottom：将控件朝其父容器内的底部对齐
  • 在控件上定义Margin属性将根据父容器的类型相对定位，这太过宽泛，无法在此处进行解释

我不清楚您希望如何定位控件，但为了回答您的问题：您可以删除控件的Width、Height、HorizontalAlignment和VerticalAlignment，使其能够在窗口中水平和垂直拉伸。例如：

<Page x:Class="App.Page2"
    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">
    <Grid
        Background="Black">
        <TabControl>
            <TabItem
                Header="TabItem">
                <Grid
                    Background="#FFE5E5E5">
                    <Button
                        Content="Add Item"
                        HorizontalAlignment="Left"
                        Margin="10,135.748,0,0"
                        VerticalAlignment="Top"
                        Width="75" />
                    <Button
                        Content="Remove Item"
                        HorizontalAlignment="Left"
                        Margin="10,177.208,0,0"
                        VerticalAlignment="Top"
                        Width="75" />
                    <Button
                        Content="Update Item"
                        HorizontalAlignment="Left"
                        VerticalAlignment="Top"
                        Width="75"
                        Margin="10,217.168,0,0" />
                </Grid>
            </TabItem>
            <TabItem
                Header="TabItem">
                <Grid
                    Background="#FFE5E5E5">
                    <Button
                        Content="Add Item"
                        HorizontalAlignment="Left"
                        Margin="10,135.748,0,0"
                        VerticalAlignment="Top"
                        Width="75" />
                    <Button
                        Content="Remove Item"
                        HorizontalAlignment="Left"
                        Margin="10,177.208,0,0"
                        VerticalAlignment="Top"
                        Width="75" />
                    <Button
                        Content="Update Item"
                        HorizontalAlignment="Left"
                        VerticalAlignment="Top"
                        Width="75"
                        Margin="10,217.168,0,0" />
                </Grid>
            </TabItem>
            <TabItem
                Header="TabItem">
                <Grid
                    Background="#FFE5E5E5">
                    <Button
                        Content="Add Item"
                        HorizontalAlignment="Left"
                        Margin="10,135.748,0,0"
                        VerticalAlignment="Top"
                        Width="75" />
                    <Button
                        Content="Remove Item"
                        HorizontalAlignment="Left"
                        Margin="10,177.208,0,0"
                        VerticalAlignment="Top"
                        Width="75" />
                    <Button
                        Content="Update Item"
                        HorizontalAlignment="Left"
                        VerticalAlignment="Top"
                        Width="75"
                        Margin="10,217.168,0,0" />
                </Grid>
            </TabItem>
        </TabControl>
    </Grid>
</Page>

只要摆弄一下这些房产，你很快就会掌握窍门。

相关文章：