【C#学习记录】如何让界面控件实现自适应布局(Winform)

这篇具有很好参考价值的文章主要介绍了【C#学习记录】如何让界面控件实现自适应布局(Winform)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

小伙伴们大家好,我是雷工!
在软件界面设计中,客户常常要求设计的界面可以随意缩放,缩放过程中,界面中的按钮等控件也会随着窗体变大缩小自动调整显示位置和尺寸大小。在C#的Winform窗体中如何实现这个效果,下面我们一起学习下。

一、样例开发环境

本样例的程序运行环境具体如下。
(1)、系统开发平台:Microsoft Visual Studio 2019。
(2)、系统开发语言:C#语言,Winform框架。

二、界面设计

1、新建Winform窗体应用程序;
2、在窗体上布局控件。
【C#学习记录】如何让界面控件实现自适应布局(Winform)

2.1、数字显示部分:

a、添加Panel控件,设置相关属性:
修改BackColor背景色,
设置Dock停靠属性(TOP),
Anchor属性:Top, Bottom, Left, Right;
b、在Panel控件上添加label控件,并设置相关属性
AutoSize属性:False;
TextAlign属性:MiddleRight;
Font属性:微软雅黑, 21.75pt;
BackColor属性:Aqua;
Anchor属性:Top, Bottom, Left, Right;

2.2、按钮部分:

添加一组Button按钮控件,并修改按钮的Text,调整合适的大小,并排列整齐。

三、运行效果:

1、按钮的位置和尺寸无法随窗口尺寸的变化而变化。
【C#学习记录】如何让界面控件实现自适应布局(Winform)
2、按钮的位置和尺寸随窗口尺寸的变化而变化。
【C#学习记录】如何让界面控件实现自适应布局(Winform)

四、实现思路

1、实现变化需要进行比例缩小或扩大,因此在窗体初始化时先获取窗体的尺寸;
2、需要遍历窗体控件记录一下窗口尺寸变化前的位置和尺寸;
3、当窗体尺寸变化时,获取当前窗体的尺寸,需要根据窗口原尺寸计算缩放比例;
4、当窗体变化后,遍历窗体控件,将根据缩放比例计算的位置和尺寸设置到控件;

五、代码实现与分析

1、需要记录的控件的位置以及尺寸

		Dictionary<string, Rect> normalControl = new Dictionary<string, Rect>();
        private void Form1_Load(object sender, EventArgs e)
        {
            //记录相关对象以及原始尺寸
            normalWidth = this.panel2.Width;
            normalHeight = this.panel2.Height;
            //通过父控件Panel进行控件的遍历
            foreach (Control item in this.panel2.Controls)
            {
                normalControl.Add(item.Name, new Rect(item.Left, item.Top, item.Width, item.Height));
            }

        }

2、根据原始比例进行新尺寸的计算并设置

private void Form1_SizeChanged(object sender, EventArgs e)
        {
            //根据原始比例进行新尺寸的计算
            int w = this.panel2.Width;
            int h = this.panel2.Height;

            foreach (Control item in this.panel2.Controls)
            {
                int newX = (int)(w * 1.00 / normalWidth * normalControl[item.Name].X);
                int newY = (int)(h * 1.00 / normalHeight * normalControl[item.Name].Y);
                int newW = (int)(w * 1.00 / normalWidth * normalControl[item.Name].Widht);
                int newH = (int)(h * 1.00 / normalHeight * normalControl[item.Name].Height);

                item.Left = newX;
                item.Top = newY;
                item.Width = newW;
                item.Height = newH;
            }
        }

六、完整代码

using System;
using System.Collections.Generic;
using System.Windows.Forms;
namespace A006_computer
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
            this.Load += Form1_Load;
            this.SizeChanged += Form1_SizeChanged;
        }
        //窗体的默认宽和高
        int normalWidth = 0;
        int normalHeight = 0;
        //需要记录的控件的位置以及宽和高(X,Y,Widht,Height)
        Dictionary<string, Rect> normalControl = new Dictionary<string, Rect>();
        private void Form1_Load(object sender, EventArgs e)
        {
            //记录相关对象以及原始尺寸
            normalWidth = this.panel2.Width;
            normalHeight = this.panel2.Height;
            //通过父控件Panel进行控件的遍历
            foreach (Control item in this.panel2.Controls)
            {
                normalControl.Add(item.Name, new Rect(item.Left, item.Top, item.Width, item.Height));
            }
        }
        private void Form1_SizeChanged(object sender, EventArgs e)
        {
            //根据原始比例进行新尺寸的计算
            int w = this.panel2.Width;
            int h = this.panel2.Height;

            foreach (Control item in this.panel2.Controls)
            {
                int newX = (int)(w * 1.00 / normalWidth * normalControl[item.Name].X);
                int newY = (int)(h * 1.00 / normalHeight * normalControl[item.Name].Y);
                int newW = (int)(w * 1.00 / normalWidth * normalControl[item.Name].Widht);
                int newH = (int)(h * 1.00 / normalHeight * normalControl[item.Name].Height);
                item.Left = newX;
                item.Top = newY;
                item.Width = newW;
                item.Height = newH;
            }
        }        
    }
    class Rect
    {
        public Rect(int x,int y,int w,int h)
        {
            this.X = x;this.Y = y;this.Widht = w;this.Height = h;
        }
        public int X { get; set; }
        public int Y { get; set; }
        public int Widht { get; set; }
        public int Height { get; set; }
    }
}

七、结束语

该功能实现的方法可能有很多,此处仅记录本人学习并实操的过程。抛砖引玉,如有不当之处或大家有更好的实现方法欢迎留言讨论。文章来源地址https://www.toymoban.com/news/detail-419873.html

到了这里,关于【C#学习记录】如何让界面控件实现自适应布局(Winform)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【Python_PySide2学习笔记(二)】QTabWidget 添加布局Layout \ QTabWidget 内控件大小自适应父窗体大小

    在做项目过程中遇到Tab页内的控件无法随着窗体大小变化,针对此问题需要对添加的Tab1、Tab2、Tab3…分别添加布局。 我们可以看到在窗体最大化后,只有Tab页内的QTableWidget控件没有自适应窗体尺寸,还是保持着原有尺寸。 在Qt Designer内查看 对象查看器: 发现只有tab_1和tab_

    2024年02月05日
    浏览(67)
  • 如何实现一个两栏布局,右侧自适应?三栏布局中间自适应?

    要实现一个两栏布局,右侧自适应的效果,可以使用 CSS 的 Flexbox 或 Grid 布局来实现。以下是使用 Flexbox 实现的示例: HTML 结构: CSS 样式: 在上述代码中,通过将父容器设置为 display: flex ,使其成为一个弹性容器。左侧列使用固定宽度(例如200px),右侧列使用 flex: 1 1 aut

    2024年01月16日
    浏览(49)
  • 如何使用CSS实现一个自适应等高布局?

    前端入门之旅:探索Web开发的奇妙世界 记得点击上方或者右侧链接订阅本专栏哦 几何带你启航前端之旅 欢迎来到前端入门之旅!这个专栏是为那些对Web开发感兴趣、刚刚踏入前端领域的朋友们量身打造的。无论你是完全的新手还是有一些基础的开发者,这里都将为你提供一

    2024年02月10日
    浏览(44)
  • VS+Qt设置窗口尺寸(二):窗体控件自适应窗口布局,自动调整大小

    VS版本:VS2019 QT版本:Qt5.12.3(msvc2017_64) 为了适配不同尺寸的显示屏,软件窗口需要调整大小,窗口内的控件尺寸也要适配窗口的大小。 本例重点讲述如何设置可调整尺寸的窗口及控件,实现窗口最大化和尺寸调节。 本例使用相对简单的按键和文本框来做示例,其他控件均可

    2023年04月23日
    浏览(104)
  • 【C#学习记录】添加控件后工具箱不显示是什么原因

    大家好,我是雷工! 今天在一个Winform程序中用到将WindowsMediaPlayer控件添加到工具箱,但添加了好几次,工具箱内均无法显示,经翻找资料和验证确认是跟创建项目时选择的模板有关,为了遇到同样问题的小伙伴能够快速解决问题,现将问题情况记录如下: 1、VS版本信息:

    2024年02月13日
    浏览(46)
  • 如何使用CSS实现一个自适应两栏布局,其中一栏固定宽度,另一栏自适应宽度?

    前端入门之旅:探索Web开发的奇妙世界 欢迎来到前端入门之旅!感兴趣的可以订阅本专栏哦!这个专栏是为那些对Web开发感兴趣、刚刚踏入前端领域的朋友们量身打造的。无论你是完全的新手还是有一些基础的开发者,这里都将为你提供一个系统而又亲切的学习平台。在这个

    2024年02月11日
    浏览(37)
  • Android布局和控件:创建用户界面的XML布局文件和常用UI控件详解

    在Android应用开发中,创建用户界面是一个重要的任务。通过使用XML布局文件和常用的UI控件,开发人员可以设计和构建出吸引人且功能丰富的应用界面。本文将详细介绍如何使用XML布局文件来创建Android应用的用户界面,并深入探讨一些常用UI控件的属性和用法。 XML布局文件是

    2024年02月17日
    浏览(41)
  • 安卓实验1 界面设计:控件和布局

    实验题目:界面设计:控件和布局 实验目的 1了解Android编程原理 2掌握基本布局管理器、控件的应用 3掌握控件的事件处理编程 实验内容 编写一个小费计算器,界面如下。在Amount框中输入就餐费用,在15%标准小费率列下将按15%计算小费(Tip)的金额和应付总金额(Total),在

    2024年02月06日
    浏览(36)
  • C# GUI编程入门指南:学习如何使用C#创建图形用户界面

    C# GUI编程入门指南:学习如何使用C#创建图形用户界面 在本文中,我们将介绍如何使用C#编写GUI程序。GUI(Graphical User Interface)是一种以图形方式呈现信息和操作功能的界面,它使得用户与计算机更加直观和友好。C#是一种强大的编程语言,它提供了丰富的库和工具来帮助我们

    2024年01月21日
    浏览(49)
  • c# 从零到精通 form界面之listView控件

    c# c# 从零到精通 form界面之listView控件 using System; using System.Data; using System.Drawing; using System.Text; using System.Windows.Forms; namespace Test04 { public partial class Form1 : Form { public Form1() { InitializeComponent(); } private void button1_Click(object sender, EventArgs e) { if (textBox1.Text == “”) { MessageBox.Show(“项目

    2024年02月08日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包