C#基础:WPF中常见控件的布局基础

news2024/11/17 23:54:24

一、用ViewBox实现放缩控件不变

二、布局代码

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="316" Width="778">

    <Viewbox Stretch="Fill">
        <Grid>
            <!-- 左侧栏和右侧栏比例 -->
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="4*"/>
                <ColumnDefinition Width="293*"/>
            </Grid.ColumnDefinitions>

            <!-- 左侧栏 0表示第一个列,又均分5行,1:1:1:1:1-->
            <Grid Grid.Column="0" >
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="1*"/>
                </Grid.RowDefinitions>
                <Label Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center">Label</Label>
                <Button Grid.Row="1" Margin="3">Button 1</Button>
                <Button Grid.Row="2" Margin="3">Button 2</Button>
                <Button Grid.Row="3" Margin="3">Button 3</Button>
                <Button Grid.Row="4" Margin="3">Button 4</Button>
            </Grid>

            <!-- 右侧栏 1表示第二个列,又分为上下两行,1:1-->
            <Grid Grid.Column="1">
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*"/>
                    <RowDefinition Height="1*"/>
                </Grid.RowDefinitions>

                <!-- 右上部分 又分为两行,3:5,不过右上部分允许跨两行,也就是越过蓝线-->
                <Grid Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Top" Width="388" Height="50" Grid.RowSpan="2">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="3*"/>
                        <RowDefinition Height="5*"/>
                    </Grid.RowDefinitions>

                    <!-- 第一行:两个搜索框 StackPanel表控件区块-->
                    <StackPanel Grid.Row="0" Orientation="Horizontal" Margin="0,0,0,24" Grid.RowSpan="2">
                        <Label Height="27">标签1</Label>
                        <TextBox Margin="5" VerticalAlignment="Center" HorizontalAlignment="Stretch" Width="Auto" Text="Search 1"/>
                        <Label Height="25">标签2</Label>
                        <TextBox Margin="5" VerticalAlignment="Center" HorizontalAlignment="Stretch" Width="Auto" Text="Search 2"/>
                    </StackPanel>

                    <!-- 第二行:选择框、复选框、按钮 -->
                    <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="2,7,2,0">
                        <Label Height="25">标签3</Label>

                        <!-- 选择框 -->
                        <ComboBox Margin="5" VerticalAlignment="Center" Width="59">
                            <ComboBoxItem Content="Option 1"/>
                            <ComboBoxItem Content="Option 2"/>
                            <ComboBoxItem Content="Option 3"/>
                        </ComboBox>

                        <Label Height="26">标签4</Label>

                        <!-- 复选框 -->
                        <CheckBox Margin="3" VerticalAlignment="Center" Content="Checkbox" FontSize="10" HorizontalContentAlignment="Left" VerticalContentAlignment="Center"/>

                        <!-- 按钮 左上右下 字体大小-->
                        <Button Margin="30 5 5 5" VerticalAlignment="Center" Content="Search" FontSize="10"/>
                    </StackPanel>
                </Grid>


                <!-- 右下部分 1表示右边栏布局的第2行-->
                <DataGrid Grid.Row="1" Margin="5,20,5,0" Height="70" VerticalAlignment="Top">
                    <!-- 数据绑定和样式设置 -->
                </DataGrid>
            </Grid>
        </Grid>
    </Viewbox>
</Window>

三、布局设计思路

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1630002.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

传统过程自动化工厂的智能扩展

一 通过NOA概念&#xff0c;公开、安全地迈向未来 随着数字化转型在过程自动化工业中的不断深入&#xff0c;许多公司都面临着同一挑战——如何平衡创新和传统。放眼望去&#xff0c;过程自动化工业和信息技术似乎在以不同的速度发展。虽然过程自动化工厂通过使用传统的自动化…

自动化爬虫工具:you-get安装与使用

Windows下的安装命令&#xff1a; pip install you-get linux下的安装命令&#xff1a; pip3 install you-get 下载完成后&#xff0c;我们可以看到如下的警告&#xff0c;意思就是这个工具并未被添加到环境变量中&#xff0c;如果我们想在命令行中直接调用&#xff0c;需要…

Docker Machine 入门实践@FreeBSD

在这篇文档里&#xff0c;我们安装了docker machine&#xff1a;FreeBSD安装Docker记录-CSDN博客 在这篇文档里&#xff0c;我们启动虚拟主机myvm并进入虚拟主机&#xff1a;boot2docker实践FreeBSD-CSDN博客 现在开始更深入的进行 docker的实战演练。参考Docker Machine官方…

Git--多人协作

目录 一、多人协作一二、多人协作二三、 远程分⽀删除后&#xff0c;本地git branch -a依然能看到的解决办法 一、多人协作一 ⽬前&#xff0c;我们所完成的⼯作如下&#xff1a; 1.基本完成Git的所有本地库的相关操作&#xff0c;git基本操作&#xff0c;分⽀理解&#xff0c;…

Java面试八股文-2024

面试指南 TMD&#xff0c;一个后端为什么要了解那么多的知识&#xff0c;真是服了。啥啥都得了解 MySQL MySQL索引可能在以下几种情况下失效&#xff1a; 不遵循最左匹配原则&#xff1a;在联合索引中&#xff0c;如果没有使用索引的最左前缀&#xff0c;即查询条件中没有包含…

RK3568平台开发系列讲解(Linux系统篇)芯片手册的使用:GPIO的寄存器说明

🚀返回专栏总目录 文章目录 一、查找复用寄存器二、查找方向寄存器三、查找数据寄存器沉淀、分享、成长,让自己和他人都能有所收获!😄 📢寄存器GPIO 进行配置, 一般情况下需要对 GPIO 的复用寄存器, 方向寄存器, 数据寄存器进行配置。 GPIO0_B0 配置为例: 一、查…

BTCOIN发布WEB3.0论坛:生态与金融的双重叙事热点驱动自由创新意识

在数字时代&#xff0c;信息的自由流动和透明度是推动经济发展和社会进步的关键。尤其在加密货币和区块链领域&#xff0c;这一点尤为重要。BTCOIN的最新创举——一个基于WEB3.0理念的信息论坛&#xff0c;不仅标志着信息传递自由化的新篇章&#xff0c;也为数字货币市场的信息…

上位机图像处理和嵌入式模块部署(树莓派4b中的软件调试)

【 声明&#xff1a;版权所有&#xff0c;欢迎转载&#xff0c;请勿用于商业用途。 联系信箱&#xff1a;feixiaoxing 163.com】 说到软件调试&#xff0c;有一点大家相信都有体会。那就是编写软件的时候&#xff0c;功能本身还是不算太复杂的。只需要前面流程、算法都设计好了…

STM32学习和实践笔记(20):定时器

1.定时器介绍 STM32F1的定时器一共有8个&#xff0c;由2个基本定时器&#xff08;TIM6、TIM7&#xff09;、4个通用定时器&#xff08;TIM2-TIM5&#xff09;和2个高级定时器&#xff08;TIM1、TIM8&#xff09;组成。 基本定时器的功能最为简单&#xff0c;类似于51单片机内定…

BGP选路原则

路由器对BGP路由的处理过程 l 策略机&#xff1a;操纵路径属性&#xff0c;对属性置值。通过影响路由表的生成&#xff0c;从而影响用户数据的转发 输入策略机影响自己及下游路由器 输出策略机不影响自己&#xff0c;只影响下游路由器 l 路由决策&#xff1a;根据BGP路…

AI赋能分层模式,解构未来,智领风潮

​&#x1f308; 个人主页&#xff1a;danci_ &#x1f525; 系列专栏&#xff1a;《设计模式》 &#x1f4aa;&#x1f3fb; 制定明确可量化的目标&#xff0c;坚持默默的做事。 &#x1f680; 转载自热榜文章&#x1f525;&#xff1a;探索设计模式的魅力&#xff1a;AI赋能分…

基于单片机公交语音报站系统设计 含源码,Proteus仿真原理图

资料下载地址&#xff1a;基于单片机公交语音报站系统设计 含源码,Proteus仿真原理图 1、前言 系统的总体设计需要充分运用STC单片机作为主控控制芯片&#xff0c;完成主控控制电路的基本设计&#xff0c;辅助控制电路是语音控制电路、12864显示电路、按键控制电路、…

通过阿里云OOS实现定时备份redis实例转储到OSS

功能背景 随着企业业务数据的快速增长&#xff0c;Redis 作为高性能的内存数据存储方案&#xff0c;在多种应用场景下承担着重要的角色。为确保数据安全&#xff0c;定时备份成为了不可或缺的一环。Redis 实例定时备份是关键数据库管理任务的一个重要组成部分&#xff0c;它主…

雷雨天气频繁,输电线路如何防雷?避雷器在线监测装置智能护电

春日将近&#xff0c;夏日绵长。再过几天便到立夏了&#xff0c;根据《二十四节气歌》的记载&#xff0c;立夏的到来意味着夏季的序幕正式拉开。立夏之时&#xff0c;万物开始增大、成长&#xff0c;是生命力旺盛的体现。此时气温回升快&#xff0c;炎热的气息逐渐袭来&#xf…

优化打印性能:为您的 Magicard 打印机选择合适的清洁用品

Magicard打印机是许多企业和组织中信赖的首选&#xff0c;其可靠性和打印质量让其成为许多人的首选。然而&#xff0c;为了保持这种可靠性和质量&#xff0c;定期清洁和维护是至关重要的。在这篇文章中&#xff0c;我们将介绍不同型号的Magicard打印机以及它们所需的正确清洁卡…

CTF-Show nodejs

web334 下载附件&#xff0c;有两个文件 在Character.toUpperCase()函数中&#xff0c;字符ı会转变为I&#xff0c;字符ſ会变为S。 在Character.toLowerCase()函数中&#xff0c;字符İ会转变为i&#xff0c;字符K会转变为k。 所以用ctfſhow 123456登录就可以出flag了 w…

磁共振质子密度脂肪分数(MRI-PDFF)适用于无创评估肝脂肪含量 目前其已完成市场化

磁共振质子密度脂肪分数&#xff08;MRI-PDFF&#xff09;适用于无创评估肝脂肪含量 目前其已完成市场化 磁共振质子密度脂肪分数&#xff08;MRI-PDFF&#xff09;又称为MRI肝脏脂肪定量&#xff0c;是一种运用磁共振技术对整个肝脏中的脂肪进行客观、定量、无创评估的成像方法…

react,Chart

一、基础图&#xff1a;https://ant-design-charts.antgroup.com/ Ant Design Charts 1. 首先要下载ant-design/charts&#xff0c;然后在页面中添加如下柱状图代码: import React from react; import { Column } from ant-design/chartsconst DemoColumn: React.FC () …

如何正确进行Lazada、速卖通、Shopee店铺补单?这些建议助你提升排名!

如今&#xff0c;在Lazada、速卖通和Shopee等电商平台上开店的卖家越来越多&#xff0c;保持店铺稳定运营成为每个卖家都需思考的问题。现在让我们一起来探讨一下&#xff0c;哪些运营上需要注意的要点。 1、精心挑选产品 跨境电商与国内电商的核心都在于产品。只有选择到优质…

spark3.0.0单机模式安装

注&#xff1a;此安装教程基于hadoop3集群版本 下载安装包 下载spark3.0.0版本&#xff0c;hadoop和spark版本要对应&#xff0c;否则会不兼容 用xftp上传Linux虚拟机&#xff0c;上传目录/bigdata&#xff08;可修改&#xff09; 解压 tar -zxvf /bigdata/spark-3.0.0-bin-h…