Windows 10 应用开发之布局控件

成为vip会员,免费看所有精品课程
  • 目录

    目录 收起>

    在前面的课程中,学员已经学习了如何处理页面与页面之间的关系(导航),而具体到单个页面中,就要涉及到用户界面排版的问题了。布局控件可以描述用户界面的基本轮廓(比如左上角放什么内容,页面底部用于显示什么视图等),以方便后续的界面设计工作的开展。本课程将讲述常用的布局控件,包括 Grid、Canvas 、StackPanel,以及新增的 RelativePanel 控件。

    1.布局控件概述 00:10:47

    本课时主要介绍布局控件的用途和分类。

    2.线性排版(StackPanel 控件) 00:02:49

    本课时介绍 StackPanel 控件中的子元素只按两个方向排列——要么是水平直线分布,要么就是沿垂直方向分布。

    3.绝对定位(Canvas 控件) 00:04:48

    本课时介绍 Canvas 控件比较接近于传统的 Windows 窗体布局,以左上角为原点,使用具体的坐标值来定位 Canvas 里面的子元素。

    4.网格(Grid 控件) 00:11:10

    本课时介绍 Grid 控件通过定义网格来完成布局,因此 Grid 的功能比较强大,可以实现相对复杂的布局。

    5.Z 顺序 00:03:57

    本课时介绍位于同一个布局容器中的元素都可以设置各自的 Z 顺序值,Z 顺序值一般从0开始。Z 顺序较大的元素会遮挡住 Z 顺序较小的元素,使用户界面看起有层次性。

    6.边距 00:05:02

    本课时介绍边距可以分为内边距和外边距,这种划分方式只是相对于可视化元素本身而言的。例如,A 元素与父元素边沿的距离为外边距;而 A 元素与它内部子元素之间的距离即为内边距。

    7.对齐方式 00:02:47

    本课时介绍对齐是按照相对空间来定位子元素的,在水平方向上有左、中、右三种对齐方式;在垂直方向上有上、中、下三个对齐点。综合起来共有九个对齐点。另外还包括水平或垂直方向上完全填充方式,这种方式会填充所有的可用空间。

    8.相对布局(RelativePanel 控件) 00:07:03

    本课时介绍 RelativePanel 控件通过相对位置来完成布局。面板中的某个元素可以根其自身与容器的,或者与面板中其他元素的相对位置来定位。当应用程序窗口的大小发生改变后,RelativePanel 面板中的元素会自动调整自身的相对位置。
  • 提问

    提交问题
  • 下载

  • 线路

    视频太卡?试试切换线路 √ 线路1 √ 线路2
  • 收藏

    收藏课程
  • 分享

连播

连续播放

关灯

关灯模式
视频加载太慢?

我们有两条线路可以选择,试试切换线路吧

Windows 10 应用开发之布局控件

8课时,48分钟
周家安
周家安

极客学院签约布道师

课程背景:
要设计体验良好的用户界面,合理划分布局是最基础,也是相对重要的一个环节。用户界面的布局划分要求开发者能够掌握并且熟练地使用各种布局控件。

核心内容:
1.布局控件的作用
2.了解布局控件的公共基类——Panel
3.Grid(网络)控件的使用
4.StackPanel 控件的使用
5.绝对定位的布局——Canvas 控件
6.使用 RelativePanel 控件进行相对定位
7.了解对齐方式与边距
8.了解 Z 顺序的排列方式

软件环境:Windows 10 + Visual Studio 2015

是否提供资料:

课程等级:初级

适合人群:
.net 开发者/基础入门者
  • 技术问答
  • 1

    布局控件概述

    10:47

    本课时主要介绍布局控件的用途和分类。

  • 2

    线性排版(StackPanel 控件)

    02:49

    本课时介绍 StackPanel 控件中的子元素只按两个方向排列——要么是水平直线分布,要么就是沿垂直方向分布。

  • 3

    绝对定位(Canvas 控件)

    04:48

    本课时介绍 Canvas 控件比较接近于传统的 Windows 窗体布局,以左上角为原点,使用具体的坐标值来定位 Canvas 里面的子元素。

  • 4

    网格(Grid 控件)

    11:10

    本课时介绍 Grid 控件通过定义网格来完成布局,因此 Grid 的功能比较强大,可以实现相对复杂的布局。

  • 5

    Z 顺序

    03:57

    本课时介绍位于同一个布局容器中的元素都可以设置各自的 Z 顺序值,Z 顺序值一般从0开始。Z 顺序较大的元素会遮挡住 Z 顺序较小的元素,使用户界面看起有层次性。

  • 6

    边距

    05:02

    本课时介绍边距可以分为内边距和外边距,这种划分方式只是相对于可视化元素本身而言的。例如,A 元素与父元素边沿的距离为外边距;而 A 元素与它内部子元素之间的距离即为内边距。

  • 7

    对齐方式

    02:47

    本课时介绍对齐是按照相对空间来定位子元素的,在水平方向上有左、中、右三种对齐方式;在垂直方向上有上、中、下三个对齐点。综合起来共有九个对齐点。另外还包括水平或垂直方向上完全填充方式,这种方式会填充所有的可用空间。

  • 8

    相对布局(RelativePanel 控件)

    07:03

    本课时介绍 RelativePanel 控件通过相对位置来完成布局。面板中的某个元素可以根其自身与容器的,或者与面板中其他元素的相对位置来定位。当应用程序窗口的大小发生改变后,RelativePanel 面板中的元素会自动调整自身的相对位置。

相关课程

  • Windows 10应用程序的页面导航

    本课程主要讲述应用程序页面与导航,以及页面与页面之间如何进行导航(包括参数的传递),导航记录管理等。常规的应用程序是由多应用页面组成(虽然不是绝对,但大多数情况是如此),每个页面可以负责完成一项功能,类似于网站中的网页。用户在使用应用程序过程中,必然会涉及到页面之间的切换(比如从“欢迎”页面跳转到“相册”页面),并且页面之间也可能需要传递信息。

    7课时 44分钟
    初级
    4440人学习
  • Windows 10 应用程序生命周期

    从用户启动应用程序,到应用程序结束,期间都发生了哪些事情?开发者需要做哪些处理工作?本课程主要向学员讲述如何在应用程序生命周期的各个阶段中做出响应,以便更好地管理应用程序数据,提升用户体验。

    3课时 19分钟
    初级
    3678人学习
  • Windows 10 通用应用项目基础

    本课程主要介绍面向 Windows 10 的 UAP 项目的基本特征,以及 UAP 项目的基本结构。通过本课程的学习,学员能够对 UAP 项目形成初步的认知,并且熟悉 UAP 应用的 API 协定。为后续的课程学习做好准备。

    5课时 31分钟
    初级
    5626人学习
  • 操作系统的功能和使用

    本课程主要讲解计算机操作系统的功能和使用相关知识,内容包括:计算机软、硬件系统的组成及主要技术指标,操作系统的基本概念、功能、组成及分类,Windows 操作系统的基本概念和常用术语以及 Windows 操作系统的基本操作和应用。

    4课时 54分钟
    初级
    18180人学习