UI Framework-1: UI Development Practices】的更多相关文章

UI Development Practices Guidelines Principles for developing for Chrome. These best practices center around ensuring features are implemented as efficiently as possible. Content Area (UI in a Tab) The UI that lives in the content area should be impl…
1 Introduction In the past 2 years I’ve been working intensively on mobile applications, mostly hybrid, and mostly with AngularJS. In my quest to find a good UI framework that integrates with AngularJS, I came across the following options: IonicFrame…
阅读列表 01 - Vue3 UI Framework - 开始 02 - Vue3 UI Framework - 顶部边栏 03 - Vue3 UI Framework - 首页 04 - Vue3 UI Framework - 文档页 05 - Vue3 UI Framework - Button 组件 ️ 06 - Vue3 UI Framework - Dialog 组件 ️ 07 - Vue3 UI Framework - Switch 组件 ️ 08 - Vue3 UI Framew…
What is an entity system framework for game development? Posted on 19 January 2012 Last week I released Ash, an entity system framework for Actionscript game development, and a number of people have asked me the question “What is an entity system fra…
WebView 里无法获得的能力虽然是「体验增强」与「端基本能力」,但现都基本上有成熟解决方法.但后期的 UI 和 Layout 的性能反而是目前 Web 技术欠缺的.所以,无论是 Titanium 与 React Native 都是解决性能作为探索的出发点. 性能慢与快的分水岭   慢与快的标准,是按照每秒大于等于 60 FPS(60 帧每秒) 的理论,而为什么是 60 FPS,这不多描述. 按此理论,那么「每帧」里所有的操作都必须在 16ms 完成. WebView 里 UI 性能慢的原因…
UI Kit 快速入门 首先我们来进行 UI Kit 的快速入门 制作一个界面的,步骤如下: 准备 生成代码 逻辑编写 运行 1. 准备 先创建一个场景 TestUIHomePanel. 删除 Hierarchy 其他的 GameObject. 搜索 UIRoot.prefab,拖入 Hierarchy. 在 UIRoot / Design GameObject 下创建 Panel ( 右击 Design -> UI -> Panel ). 将该 Panel 改名为 UIHomePanel.…
iPhone/iPad/Android UI尺寸规范 UI尺寸规范,UI图标尺寸,UI界面尺寸,iPhone6尺寸,iPhone6 Plus尺寸,安卓尺寸,iOS尺寸 iPhone界面尺寸 设备 分辨率 PPI 状态栏高度 导航栏高度 标签栏高度 iPhone6 plus设计版 1242×2208 px 401PPI 60px 132px 146px iPhone6 plus放大版 1125×2001 px 401PPI 54px 132px 146px iPhone6 plus物理版 1080…
[Android线程机制] 出于性能考虑,Android的UI操作并不是线程安全的,这就意味着如果有多个线程并发操作UI组件,可能导致线程安全问题.为了解决这个问题,Android制定了一条简单的规则:只允许UI线程修改Activity里的UI组件 当一个程序第一次启动时,Android会同时启动一条主线程(Main Thread),主线程主要负责处理与UI相关的事件,如用户的按键事件,用户接触屏幕的事件及屏幕绘图事件,并把相关的事件分发到对应的组件进行处理.所以主线程通常又被叫做UI线程 [H…
在前面的文章<HTML5 UI框架Kendo UI Web自定义组件(一)>中,对在Kendo UI Web中如何创建自定义组件作出了一些基础讲解,下面将继续前面的内容. 使用一个数据源 现在如果想要实现一个数据源组件或是MVVM aware模式,需要再执行一些其他的步骤. 在下面将会创建一个DataSource aware组件,要使DataSource aware有数据源,首先需要在DataSource基础对象上使用create convenience方法. 创建或初始化数据源: that.…
iframeWin For Easy UI. 为 Easy UI 扩展的支持IFrame插件 在一个项目中用了Easy UI,但是发现里面的 Dialog .Window.Messager 弹窗都不支持IFrame的方式, 于是自己动手基于Easy UI实现了一个插件. 目前Easy UI仍然使用GPL开源协议. JS引用: <script type="text/javascript" src="jquery.min.js"></script>…
Android应用的开发过程中需要把繁重的任务(IO,网络连接等)放到其他线程中异步执行,达到不阻塞UI的效果. 下面将由浅入深介绍Android进行异步处理的实现方法和系统底层的实现原理. 本文介绍Android异步处理一:使用Thread+Handler实现非UI线程更新UI界面: 即如何使用Thread+Handler的方式从非UI线程发送界面更新消息到UI线程. 概述:每个Android应用程序都运行在一个dalvik虚拟机进程中,进程开始的时候会启动一个主线程(MainThread),…
2D UI的工作原理 UI控件的位置在UI Root 的红框(视窗)上,也就是UI控件的z轴,相机的z轴,UI Root的z轴都是0,因为2D UI都是纯粹的2D图片按层次显示,不会不出现三维立体效果,所以都是直接紧贴着视窗,只要UI控件在UI Root的红框范围内,那么UI就能够正常显示在Game上. 2D UI最本质的意义是:UI摄像机是一个正交摄像机. 3D UI的工作原理 在3D UI下,创建的UI控件都在一个三维立体空间中,摄像机是一个透视的摄像机,这和2D UI有着截然不同的区别,因…
[Android线程机制] 出于性能考虑,Android的UI操作并不是线程安全的,这就意味着如果有多个线程并发操作UI组件,可能导致线程安全问题.为了解决这个问题,Android制定了一条简单的规则:只允许UI线程修改Activity里的UI组件 当一个程序第一次启动时,Android会同时启动一条主线程(Main Thread),主线程主要负责处理与UI相关的事件,如用户的按键事件,用户接触屏幕的事件及屏幕绘图事件,并把相关的事件分发到对应的组件进行处理.所以主线程通常又被叫做UI线程 [H…
时隔第一次被UI思路激励,到现在1.0的粗糙版本发布,掐指一算整整半年了.半年之间,有些细节不断推翻重做,再推翻再重做.时隔今日,终于能先出来个东西了,这个版本很粗糙,主体功能大概能实现了,但是还是有很多很多的问题.不过有问题没事,可以进行修改完善,这是相对轻松的问题,最艰难的从无到有的创造才是最艰难的.好了,不废话了,我们直接进入正题 --- UI.js功能介绍. 首先介绍几个概念 分布式:原来的概念只有分布式计算,它研究如何把一个需要非常巨大的计算能力才能解决的问题分成许多小的部分,然后把这…
最近公司的大厅要重做,我协助主程一起制作新大厅和新框架,前面制作的编辑器也派上了用场.等全部功能做完后我会再写一个复盘,这两天主程在忙于写热更新的功能,所以把接入分享SDK功能的任务交给了我,ShareSDK官网的文档比较分散,而且关于Unity的文档比较简略,所以还是有不少的坑.写篇博客分享一下,并加强理解记忆. 第一步,先去ShareSDK的官网下载最新版本的ShareSDK(完全免费).地址:http://www.mob.com/ 我们选择ShareSDK For Unity3D,页面会直…
国产 WEB UI 框架 (收费)-- Quick UI,Mini UI : http://www.uileader.com/ http://www.miniui.com/…
目录: Android异步处理一:使用Thread+Handler实现非UI线程更新UI界面Android异步处理二:使用AsyncTask异步更新UI界面Android异步处理三:Handler+Looper+MessageQueue深入详解Android异步处理四:AsyncTask的实现原理 Android异步处理一:使用Thread+Handler实现非UI线程更新UI界面 概述:每个Android应用程序都运行在一个dalvik虚拟机进程中,进程开始的时候会启动一个主线程(MainTh…
jQuery UI vs Kendo UI http://jqueryuivskendoui.com/#introduction jQuery Mobile vs Kendo UI Mobile http://jqueryuivskendoui.com/#mobile-introduction Kendo UI教程 http://www.cnblogs.com/pangblog/archive/2013/09/10/3313135.html…
onsen & UI vue & mobile UI $ npm i onsenui vue-onsenui # OR $ npm i -S onsenui vue-onsenui https://onsen.io/vue/ https://onsenui.github.io/vue-onsenui-kitchensink/ https://github.com/onsenui/vue-onsenui-kitchensink https://onsen.io/v2/api/vue/ //…
本文转自:http://devgirl.org/2014/01/20/ionic-mobile-ui-framework-for-phonegapcordova-developers/ Ionic is both a CSS framework as well as a JavaScript UI library. If you’re an AngularJS developer you will be right at home as Ionic uses AngularJS Extensio…
前端自动化测试框架 项目说明 本框架是一套基于selenium+Python3.7+yaml+Robot Framework而设计的数据驱动UI自动化测试框架,Robot Framework 作为执行器,本框架整体特点为:用例与代码分离:用例驱动测试的执行:分层设计.脚本模块化:自动准备测试条件和数据.事后清理:支持失败多次重试.且在每次重试前都会还原一次测试环境,保证重试的成功率:支持邮件呈现测试结果:可灵活挑选项目和用例执行. 框架特点说明 数据驱动 封装一个测试脚本,通过不同的数据来驱动,…
测试自动化程序的任务 基于反射的ui测试自动化程序,要完成的6项任务: 通过某种方式从测试套件程序中运行待测程序(AUT: Applicaton Under Test),以便于两个程序之间进行通信 操纵应用程序的窗体,从而模拟用户对窗体所实施的moving和resizing操作 检查应用程序窗体,确定应用程序的状态是否准确 操纵应用程序控件的属性,从而模拟用户的一些操作,比如模拟在一个TextBox控件里输入字符 检查应用程序控件的属性,确定应用程序的状态是否准确 调用应用程序的方法,从而模拟一…
官网基本做好了,接下来开始做核心组件 返回阅读列表点击 这里 目录准备 在项目 src 目录下创建 lib 文件夹,用来存放所有的核心组件吧.然后再在 lib 文件夹下创建 Button.vue 文件. 您也可以进行结构化设计,比如,这里就不进行了. |-lib |-Button |- Button.vue |- Button.ts |_ Button.scss 需求分析 惯例先行需求分析 多种类基础 Button,包含警告.成功.危险等 允许设置 Button 为禁用状态 不止有传统 Butt…
写在前面 一年多没写过博客了,工作.生活逐渐磨平了棱角. 写代码容易,写博客难,坚持写高水平的技术博客更难. 技术控决定慢慢拾起这份坚持,用作技术学习的阶段性总结. 返回阅读列表点击 这里 开始 大前端时代,最近在面试前端工程师的过程中,有感而发,技术更新迭代快,学习成本高.浏览了各大博客论坛,千差万别,比较混乱.最终决定参考 Element UI 的设计风格,主题色选择紫色(受到 MaterialDesignInXamlToolkit 的影响),写一套基于 Vue3 的 UI 框架库和对应的官…
顶部边栏做完了,接下来开始做官网的首页 返回阅读列表点击 这里 创建视图文件夹 让我们先新建一个 src/views 文件夹,用来存放官网的主要视图 然后在该文件夹下新建两个 vue 文件,作为我们的视图 Home.vue,首页 Document.vue,文档页 再配置一下 router.ts 来实现跳转 import { createWebHistory, createRouter } from 'vue-router' import Home from './views/Home.vue'…
为了更好的提升用户体验,我们这里再做一个很常用的开关组件 switch 返回阅读列表点击 这里 需求分析 开始之前我们先做一个简单的需求分析 switch 组件应分为选中/未被选中,两种状态 可以通过点击变更选中状态 不同的选中状态有不同的颜色,且有滑块处于不同的端 可以指定不同的尺寸 可以自定义颜色 可以设置为禁用 那么可以整理出以下参数表格 参数 含义 类型 可选值 默认值 value 默认选择状态 boolean false / true false size 尺寸 string midd…
接下来再做一个常用的组件 - input 组件 返回阅读列表点击 这里 需求分析 开始之前我们先做一个简单的需求分析 input 组件有两种类型,即 input 和 textarea 类型 当类型为 textarea 时,可以自定义行高,但是当类型为 input 时,行高恒为 1 可以自定义外边框的颜色 可以设置为禁用 那么可以得到如下参数表格 参数 含义 类型 可选值 默认值 value 绑定值 string 字符串 必填 theme 类型 string input / textarea in…
接下来做个自定义的表格组件,即 table 组件 返回阅读列表点击 这里 需求分析 开始之前我们先做一个简单的需求分析 基于原生 table 标签的强语义 允许用户自定义表头.表体 可选是否具有边框 那么可以整理出以下参数表格 参数 含义 类型 可选值 默认值 heads 表头 Array 数组,每一项包含两个 string 字段:name.identifier 必填 datas 表数据 Array 数组,每一项包含与 heads 相同数量的 string 字段 必填 bordered 是否有边…
标签页是非常常用的组件,接下来我们来制作一个简单的 Tabs 组件 返回阅读列表点击 这里 需求分析 我们先做一个简单的需求分析 可以选择标签页排列的方向 选中的标签页应当有下划线高亮显示 切换选中时,下划线应当有动画效果 应当允许更换颜色 那么可以整理出以下参数表格 参数 含义 类型 可选值 默认值 direction 方向 string row / column row selected 默认选中 string 子项的 name 必填 color 颜色 string 任意合法颜色值 #d3c…
卡片是非常常用也是非常重要的组件,特别是在移动端的众多应用场景中,随便打开一个手机 App ,您会发现充斥着各种各样的卡片. 所以,我们也来制作一个简易的 Card 组件 返回阅读列表点击 这里 需求分析 我们先做一个简单的需求分析 允许用户自定义内容 允许更换颜色 那么可以整理出以下参数表格 参数 含义 类型 可选值 默认值 color 颜色 string 任意合法颜色值 #d3c8f5 骨架 所以很容易能够得到如下骨架代码: <template> <div class="j…