zoukankan      html  css  js  c++  java
  • [WPF]auto和*总结

    Auto和*效果

    Auto 表示自动适应显示内容的宽度, 控件有多大,就显示多大。

    * 则表示按比例来分配宽度。

    话不多说,直接上例子理解

    例子1

     

    代码:

      <Grid ShowGridLines="True">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
    
            <!--控件-->
            <Button Grid.Row="0" Content="Auto按钮"/>
            <Button Grid.Row="1" Content="*按钮"/>
            <Button Grid.Row="2" Content="Auto按钮"/>
            <Button Grid.Row="3" Content="*按钮"/>
        </Grid>

    可以看出,Auto表示自动适应控件的宽度,按钮默认多大就显示多大,而剩余的区域则由*去分配,由此可能导致出现一个问题,看下面这个例子。

    例子2

     

    代码:

    //XAML部分代码:
    <Grid ShowGridLines="True">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
    
            <!--控件-->
            <Button Grid.Row="0" Content="Auto按钮"/>
            <Button Grid.Row="1" Content="Auto按钮"/>
            <Image Grid.Row="2" Name="Imagebox"></Image>
            <Button Grid.Row="3" Content="Auto按钮"/>
    </Grid>
    
    
    
    
    //后台部分
    public MainWindow()
    {
          InitializeComponent();
          var image1 = new System.Windows.Media.Imaging.BitmapImage();
          image1.BeginInit();
          image1.UriSource = new Uri(@"F:测试图片	estIMG10201.jpg", UriKind.Absolute);
          image1.EndInit();
          Imagebox.Source = image1;
    }

    可以看出,全部用Auto的话,从上往下渲染,Image的尺寸过大,程序已经显示不下了,把后面的按钮也抵消掉了,这里我们就需要换一种思路,改成下面这种:

    代码:

    //XAML代码
     <Grid ShowGridLines="True">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
    
            <!--控件-->
            <Button Grid.Row="0" Content="Auto按钮"/>
            <Button Grid.Row="1" Content="Auto按钮"/>
            <Image Grid.Row="2" Name="Imagebox"></Image>
            <Button Grid.Row="3" Content="Auto按钮"/>
    </Grid>
    
    //后台代码和上面一样不变,这里就不写了

    GIF效果图:

    我们会发现在三个使用了Auto的Grid中,会先自动按照控件的大小进行分配高度,分配完成之后剩下的部分就由使用了*的部分去分配高度。

    当然,具体问题具体分析,项目有不同的需求的话也需要尝试各种布局规则。

    总而言之,先分配Auto,最后分配*,Auto有多大就显示多大,也不会管存在显示不下的问题,需要自行解决

    https://github.com/li-zheng-hao
  • 相关阅读:
    爬虫入门系列(一):快速理解HTTP协议
    python爬虫如何入门
    利用python基于微博数据打造一颗“心”
    Python 爬虫:把廖雪峰教程转换成 PDF 电子书
    用python爬取微博数据并生成词云
    4本相见恨晚的Linux入门书籍
    程序员薪酬大调查:学哪种语言最赚钱?
    无人车时代:用深度学习辅助行人检测
    老大哥在看着你!我国部署超2000万个AI监控系统
    以彼之道,还施彼身——使用机器学习来揪出作弊的玩家
  • 原文地址:https://www.cnblogs.com/lizhenghao126/p/11053595.html
Copyright © 2011-2022 走看看