首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    App项目实战之路(四):UI

    成果 上一篇文章[原型篇]发布之后,就开始设计UI了,包括Icon和界面UI,周一到周五晚上一般花两到三到小时,周六日的时候则有五六个小时,最终用了一个星期多才设计完成。...那么,接下来,我讲讲我自己在使用Sketch设计这些UI的过程中遇到的一些坑,以及填坑的过程。也可以算是一份新手教程吧,不过,是从设计整个App的角度来讲的。...其中,Sketch App Sources貌似不访问外国网站上不去。...至于为什么需要适配这么多尺寸,就需要了解Android和iOS的一些UI尺寸的基础知识了,关于这个,下面这篇文章已经讲得很清楚了: 手机APP UI设计尺寸基础知识 Material Design...做为离用户最近的App程序猿,就应该懂一些UI设计的知识。

    1.2K30

    dotnet Multi-platform App UI 多平台应用 UI 框架简介

    为了满足多平台开发的需求,微软改名部推出了一个新的 UI 框架叫 .NET Multi-platform App UI 简称 .NET MAUI 框架 让我们向您介绍 .NET MAUI 是什么,如何做到延续单个技术栈的经验..."; } MVU 此外,微软支持开发人员使用 Model-View-Update (MVU) 模式开发,以及编写流畅的 C# UI 应用。...MVU 是一个新的开发模式,特点是促进数据和状态管理的单向流程,以及通过仅应用必要的更改来快速更新UI的代码优先开发模式。...这将是合并 Xamarin 和 Xamarin.Forms 到 .NET 核心中的漫长旅程的开始,微软很高兴与您一起开放的进行开发 大佬的翻译博客:[翻译] .NET 官宣跨平台 UI 框架 MAUI...- hez2010 - 博客园 官方文章请看 Introducing .NET Multi-platform App UI

    5.2K20

    uni-app实战之社区交友APP(3)Vue.js和uni-app基础

    文章目录 前言 一、基础组件、CSS选择器和flex布局的使用 1.view、text组件和动画的使用 2.uni-app中的CSS选择器 3.flex布局基础 二、数据渲染和动态绑定 1.数据渲染...2.class和style绑定 3.条件渲染 4.列表渲染 三、事件和属性处理 1.事件处理器 2.监听属性 3.计算属性 总结 前言 本文主要介绍了uni-app和Vue的基础使用: 基础组件的使用...微信小程序 space String 无 显示连续空格 App、H5、微信小程序 decode Boolean false 是否解码 App、H5、微信小程序 测试如下: <...2.uni-app中的CSS选择器 uni-app中支持的选择器如下: 选择器 举例 举例说明 .class .intro 选择所有拥有 class=“intro” 的组件 #id #firstname...总结 作为以Vue为基础的框架,uni-app很多方面都依赖于Vue的用法,因此要想更高效地进行uni-app跨端开发,掌握Vue基础用法是很有必要的,只有将其灵活地应用于uni-app项目中,才能达到事半功倍的效果

    2.4K20

    Tuniao UI - 图鸟 UI,基于 uni-app 开发、免费可商用的微信小程序 H5 App UI 框架

    今天来分享一款非常优秀的前端UI框架。...图鸟UI,是基于uni-app进行开发的UI框架,提供丰富的组件进行快速开发,已经支持H5、微信小程序和APP,包含常用表单组件、信息展示组件等,并提供丰富的酷炫页面模板。...尽管市面上有很多的开源UI组件库,但组件库仅仅是提供一些页面组件,实则还是需要自己利用这些组件去丰富页面,最终的UI效果还是很不理想。 这就是我为什么用图鸟UI的最大原因。...总的来说图鸟UI具备如下几个特点: 图片 上面提到的几点,是图鸟UI所有的模板所具备的特点,例如基于uniapp编写一套代码,可以编译成多端程序(H5、微信小程序、App等)。...- 图鸟 UI,基于 uni-app 开发、免费可商用的微信小程序/ H5 / App UI 框架

    1.1K11

    【设计】近期发现的 APP UI 设计趋势

    翻译文章,作者:AppMaster.io https://appmaster.io/blog/top-10-mobile-app-ui-design-ideas-2022 ---------------...---------------------------- 今天分享一篇翻译文章,关于 UI 设计趋势的整理,希望可以带给你更多帮助!...在新一年中,这种神奇的 UI 移动设计趋势趋于增长和传播。这种设计趋势的关键在于应用程序的界面让您感觉自己置身于应用程序中。引人入胜的设计元素和游戏化是这种体验的关键。...8、渐变和透明元素 这个UI设计趋势是关于渐变和透明度的。设计师通常在按钮和应用程序的背景上使用渐变。移动渐变趋势突出了应用程序的基本部分,并使人们专注于特定方面,从而赋予他们层次感。...如果让你的UI设计更好呢? 这里有一些建议: 1. 多看别人的优秀设计 分析它们的优缺点,从他们的经验中学习。 2. 使用标准导航 不要使用异型的导航栏,这会让你的用户迷失在应用中。 3.

    1K30

    iOS开发之提取AppUI素材

    在学习当中,有时候看到非常好的App,手痒的同学可能都想"临摹"一番,但是往往由于无法获取AppUI素材以致"功败垂成",今天就介绍一下如何快速提取App中的素材"为我所用",但是注意提取出来的素材是别人的成果...一、打开iTunes,在App Store下载自己觉得UI做的不错的App,如美团,直接搜索美团,然后下载即可,下载完成以后可以在我的应用中看到App。 ?...下载App.png 二、将App直接拖拽到桌面,得到App的ipa文件 ?...拖拽App.gif 三、下载第三方工具 iOSImagesExtractor,下载地址 https://github.com/devcxm/iOS-Images-Extractor 目前是0.3.1版本...iOSImagesExtractor.png 四、直接将上面得到的ipa直接拖进工具中,点击Start按钮开始获取UI素材,然后点击Output Dir查看素材 ?

    1.6K90

    译 | .NET Multi-platform App UI 多平台应用 UI 框架简介

    为了满足多平台开发的需求,微软改名部推出了一个新的 UI 框架叫 .NET Multi-platform App UI 简称 .NET MAUI 框架 让我们向您介绍 .NET MAUI 是什么,如何做到延续单个技术栈的经验...每个平台和UI控件的本机功能都可以通过一个简单的跨平台API触手可及,您可以在提供不妥协的用户体验的同时共享比以前更多的代码 单一项目开发体验 .NET MAUI 的构建考虑了开发人员的生产力,包括开发人员需要的项目系统和跨平台工具..."; } MVU 此外,微软支持开发人员使用 Model-View-Update (MVU) 模式开发,以及编写流畅的 C# UI 应用。...MVU 是一个新的开发模式,特点是促进数据和状态管理的单向流程,以及通过仅应用必要的更改来快速更新UI的代码优先开发模式。...核心中的漫长旅程的开始,微软很高兴与您一起开放的进行开发 官方原文:https://devblogs.microsoft.com/dotnet/introducing-net-multi-platform-app-ui

    4.8K10

    APP UI自动化测试思路总结

    接下来,一起总结一下APP UI自动化测试的思路吧。  一,开发语言选择   通常用于自动化测试的编程语言有:Python、Java、Javascript、Ruby、C#、PHP等。...目前较为主流或者使用较多的APP UI自动化测试框架有Appium、Airtest等。...四,测试环境搭建 1,测试电脑选择   有条件的话建议使用Mac机器专门用于UI自动化测试,因为ios app ui自动化只能在Mac机器上进行。...2,确定目录结构   推荐使用Page Object设计模式来开发APP UI自动化测试项目,请参考博客Page Object设计模式。...七,总结   总结APP UI自动化可使用以下几种实现方式:   1,python + appium + unittest + HTMLTestRunner   2,python + appium +

    1.1K30

    为uni-app而生的多端UI框架

    今天,大师兄就为大家推荐一款多端发布的通用UI框架:uView UI 关于 uView UI uView UI 是一个全面兼容nvue的uni-app生态框架。...它提供了用于 uni-app 多端开发 的优质 UI 组件库和便捷的工具,为你的应用保驾护航。...uView UI 不仅仅是 web 应用界面的 UI 组件库,它专为 uni-app 而生,能够在App、H5、各家小程序平台中完美一致地运行,目标是成为 uni-app 生态最优秀的UI框架。...uView UI 框架特色 指南文档涵盖 uni-app 开发的各个方面,官方编写的文档中有强烈的指导性,对新手很友好。...适用领域 uView是uni-app生态专用的UI框架,可以使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码可发布到 iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条

    1.4K30

    uni-app: 使用Vue.js需要注意哪些问题?

    uni-app 在发布到 H5 时,是支持所有 vue 的语法的。但是发布到App或者小程序时,由于各个平台等限制,无法实现全部 vue 语法,本文将详细讲解差异。...相比Web平台, Vue.js 在 uni-app 中使用差异主要集中在两个方面: 新增:uni-app除了支持Vue实例的生命周期,还支持应用启动、页面显示等生命周期 受限:相比web平台,在小程序和...App端部分功能受限,具体见下。...应用生命周期包括下列函数 1、onLaunch 当uni-app 初始化完成时触发(全局只触发一次) 2、onShow 当 uni-app 启动,或从后台进入前台显示 3、onHide 当...uni-app 从前台进入后台 4、onUniNViewMessage 对 nvue 页面发送的数据进行监听 注意 (1)、应用生命周期仅可在App.vue中监听,在其它页面监听无效。

    5.6K20

    Vue.js高仿饿了么外卖App学习记录

    开发一款vue.js开发一款app,使用vue.js是一款高效的mvvm框架,它轻量,高效,组件化,数据驱动等功能便于开发。使用vue.js开发移动端app,学会使用组件化,模块化的开发方式。...Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件,Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习,非常容易与其它库或已有项目整合。...vue-cli,vue.js的开发利器,脚手架 vue-cli可以搞定,目录结构,本地调试,代码部署,热加载,单元测试。 vue-cli的安装方法: ​ ?.../App.vue';importrouterfrom'..../common/stylus/icon.styl';Vue.use(VueResource);newVue({el:'#app', router,render:h=>h(App)}); ​ ?

    2.3K11

    vivo官网APP全机型UI适配方案

    案例1:某个视频APP页面,未做pad上的适配,打开之后的效果如下,两边大量留白,是不可操作的区域。...案例2:某新闻资讯类APP,在pad上的适配效果如下,可见的范围内,信息流展示内容较少,图片有拉伸、模糊的问题。...(3)数据源驱动UI,千万不要在UI层面判断机型做UI的动态计算,页面会闪屏,体验不好。3.4 方案落地实战上面介绍了不同机型的适配规范,这个没有疑问之后,直接通过案例来看下具体如何实施。...我们是一个安装包适配所有机型,每种机型的APP展示的样式虽然不同,对于开发者来说,就是增加了一个样式,思路比较清晰。2、全场景适配。...5.2.2 我们还有什么要改进回首方案,我们这里做到的是使用全屏模式去适配不同机型,更多的适用于像京东、淘宝、商城等电商类APP上,实际上,现在有些非APP会采用分栏的形式做适配,这也是一种跟用户交互的方式

    1.6K30
    领券