鹏叔(https://pengtech.net)

导航

2022年10月22日 #

Material Design简介

摘要: ## 介绍 Material 是 Google 创建的一个设计系统,旨在帮助团队为 Android、iOS、Flutter 和 Web 构建高质量的数字体验。 ## 原则 ### 材料是隐喻 Material design的灵感来自物理世界及其纹理,包括它们如何反射光线和投射阴影。Material 阅读全文

posted @ 2022-10-22 17:54 eagle.supper 阅读(103) 评论(0) 推荐(0) 编辑

Material Design 基础 - Component behavior

摘要: ## 前言 本页描述组件在布局中的行为,包括与网格以及断点的关系。 ## Position术语 UI元素在每个分界点范围内的行为方式不同。UI元素、组件和表面在网格中的位置用以下术语描述。 | Position term | Definition | | : | : | | Above; below 阅读全文

posted @ 2022-10-22 17:53 eagle.supper 阅读(39) 评论(0) 推荐(0) 编辑

Material Design 基础 - Elevation(标高)

摘要: ## 1. Elevation(标高) Elevation(标高)是沿 z 轴的两个Surface之间的相对距离。 ## 2. 测量标高 Material Design中的标高为Material surfaces之间的距离。从一个Material surface的前部到另一个Material sur 阅读全文

posted @ 2022-10-22 17:51 eagle.supper 阅读(163) 评论(0) 推荐(0) 编辑

Material Design 基础 - Layout

摘要: ## 理解layout material设计布局使用统一的元素和间距,以鼓励在多种平台、环境和屏幕尺寸之间的一致性。 ### 原则 * Predictable(可预测的) 使用直观且可预测的布局,并具有一致的UI区域和空间组织。 * Consistent(一致的) 布局应始终使用网格、关键线和填充。 阅读全文

posted @ 2022-10-22 17:48 eagle.supper 阅读(66) 评论(0) 推荐(0) 编辑

Material Design基础 - Light and shadows

摘要: ## 光线和阴影 material surface阻挡光源时会投射阴影。 在material设计环境中,虚拟灯光照亮UI。关键灯光创建更清晰的方向性阴影,称为关键光阴影。环境光从各个角度出现,以创建漫射的柔和阴影,称为环境光阴影。 ## 光源 material环境中的阴影由关键灯光和环境光投射。在A 阅读全文

posted @ 2022-10-22 17:47 eagle.supper 阅读(30) 评论(0) 推荐(0) 编辑

Material Design 基础 - 文字排版

摘要: - [1. 文字系统 (The type system)](#1-文字系统-the-type-system) - [1.1. 文字类型标尺(Type scale)](#11-文字类型标尺type-scale) - [1.2. 文字类型标尺生成器](#12-文字类型标尺生成器) - [1.3. 文字类 阅读全文

posted @ 2022-10-22 17:45 eagle.supper 阅读(223) 评论(0) 推荐(0) 编辑

Material Design基础 - Surfaces

摘要: Material Surfaces Material设计具有三个维度的品质,这些品质反映在其对表面(Surfaces)、深度和阴影的使用中。 Material environment 在真实世界中,物体可以堆叠或相互接触,但不能相互传递。它们投射阴影并反射光线。 Material设计在Materia 阅读全文

posted @ 2022-10-22 17:42 eagle.supper 阅读(63) 评论(0) 推荐(0) 编辑

Material Design基础 - spacing methods

摘要: spacing methods spacing methods使用基线网格、关键线、填充和增量间距来调整比率、容器和触摸目标。 基准网格 8dp网格 所有组件都与移动设备、平板电脑和台式机的8dp方形基线网格对齐。 4dp网格 组件中的图标、type和某些元素可以与4dp网格对齐。 间距方法 间距方 阅读全文

posted @ 2022-10-22 17:41 eagle.supper 阅读(20) 评论(0) 推荐(0) 编辑

Material Design基础 - 响应式布局网格

摘要: 响应式布局网格 Material Design的响应式布局网格可根据屏幕大小和方向进行调整,确保布局的一致性。 Columns, gutters, and margins 响应式布局网格由三个元素组成:Columns, gutters, 和 margins。 Columns 内容放置在屏幕上包含列的 阅读全文

posted @ 2022-10-22 17:41 eagle.supper 阅读(125) 评论(0) 推荐(0) 编辑

Material Design基础 - Pixel Density

摘要: 像素密度(Pixel Density) 一英寸屏幕上存在的像素数称为像素密度。 屏幕像素密度和分辨率因平台而异。 屏幕密度变化 高密度屏幕的每英寸像素数比低密度屏幕的多。因此,相同像素尺寸的UI元素在低密度屏幕上显示得更大,而在高密度屏幕上显示得更小。 计算屏幕密度(screen density) 阅读全文

posted @ 2022-10-22 17:40 eagle.supper 阅读(103) 评论(0) 推荐(1) 编辑

Material Design 基础 - 导航

摘要: 说明 导航允许用户在应用程序中移动。 导航类型 导航是在应用程序的屏幕之间移动以完成任务的行为。它是通过几种方式实现的:专用导航组件、将导航行为嵌入内容以及平台功能。 航行方向 根据应用程序的信息架构,用户可以向以下三个导航方向之一移动: Lateral navigation指的是在同一层级的屏幕之 阅读全文

posted @ 2022-10-22 17:39 eagle.supper 阅读(92) 评论(0) 推荐(0) 编辑

Material Design 基础 - 颜色

摘要: - [1. 颜色系统](#1-颜色系统) - [1.1. 颜色用法和调色板](#11-颜色用法和调色板) - [1.2. 颜色和主题](#12-颜色和主题) - [1.2.1. 原则](#121-原则) - [1.3. 基线材质颜色主题](#13-基线材质颜色主题) - [1.3.1. 原色](#1 阅读全文

posted @ 2022-10-22 17:37 eagle.supper 阅读(544) 评论(0) 推荐(0) 编辑

gitlab安装升级及迁移

摘要: ## 1. gitlab简介 GitLab 是一个用于仓库管理系统的开源项目,使用Git作为代码管理工具,并在此基础上搭建起来的Web服务。 GitLab是由GitLabInc.开发,使用MIT许可证的基于网络的Git仓库管理工具,且具有wiki和issue跟踪功能。使用Git作为代码管理工具,并在 阅读全文

posted @ 2022-10-22 17:35 eagle.supper 阅读(928) 评论(0) 推荐(0) 编辑

破解Gitlab EE 15

摘要: 1. 安装gitlab-ee 2. 环境说明 3. 安装必要软件 3.1. 安装ruby 3.2. 安装gitlab-license 4. 破解方法 5. 后记 6. 参考文档 1. 安装gitlab-ee 参考我的文章 鹏叔的IT技术博客空间 - gitlab安装升级及迁移 2. 环境说明 当前我 阅读全文

posted @ 2022-10-22 16:52 eagle.supper 阅读(5041) 评论(1) 推荐(1) 编辑

Web基础大全

摘要: - [1. HTML 基础](#1-html-基础) - [1.1. HTML简介](#11-html简介) - [1.2. HTML整体结构](#12-html整体结构) - [1.3. html头部](#13-html头部) - [1.3.1. 定义和用法](#131-定义和用法) - [1.3 阅读全文

posted @ 2022-10-22 16:46 eagle.supper 阅读(42) 评论(0) 推荐(0) 编辑