前些日子几大互联网巨头展开了一轮网盘空间大战。一下子从G级别提高到了T级别。以后谁的空间没有1T估计都不好意思开口了~~~

试用了一下360云盘的客户端,比较小清新(不是给360打广告~~~)。刚好UI这一块是我最不擅长的,于是萌发了练习模仿它的UI的念头~~~顺便把复习一下自定义控件的使用。

以下是完成的效果图,左边是官方的,右边是我模仿的:

还挺像的吧~~~

先介绍一个神器:UI Automator Viewer

这个SDK的tools文件夹或DDMS中都可以找到。

它可以很方便地查看UI的视图层级和UI控件的具体位置与实现。相当好用,有了它我们就不用去猜官方到底是怎么实现的、使用什么布局了。

具体实现

先从登录页面开始:

这个页面是比较简单的,从工具来看它的输入框是这么实现的:

一下子就清晰了。边框的线可以用一个“NinePath”图片来做:

关于NinePath的用法,可以查看官方教程:

接下来第就是自动定义按钮样式了。

首先,直接用一个背景图片肯定是不够的,因为这样就没有按下的效果了。也就是说我们要把一系列的图片组成起来,让它们根据控件的不同状态去选择。比如我们可以这么写:

还是比较好理解的,但有一点要注意,一般要在最后给一个没有android:state_xxx的item。这个item表示当前面的状态都不匹配时,使用这个item。

这个xml一般放在res/drawable目录下。然后我们就它设置到按钮的背景上即可。

关于style的使用:

以前我写布局的时候是比较少用style的,但这显然是不利的。因为android引入style的目的就在于,提供一个类似于HTML的编写方式,让样式可以重复使用,减少重复代码。而且对于样式的修改,只需要改动一处即可。

我个人的觉得,如果一个样式只用到一次就没必要把它抽到styles.xml文件中,因为抽出样式会大大妨碍我们阅读布局文件的。但如果这个样式被重复使用了,那就很有必要了。

比如刚刚的边框,就可以写到一个style里面:

match_parent

36dp

18dp

18dp

@drawable/login_border

center_vertical

10dp

horizontal

接下来是重点:

用到了SlidingMenu可以github上的一个开源项目:

左右切换可以用android-support-v4.jar提供的ViewPager,配合Fragment。

上边的指示器,360是这么实现的:

我估计它是把下边的蓝色指示条用一个RelativeLayout来盛放了。但这个是可以不用的。比如我的实现:

可以用一个TextView就实现,对于要让文字居中,只需要一个android:gravity=”center”即可。根据Android官方文档,减少视图的层级有利于程序的性能。

至于标识的切换,我们只需要给ViewPager设置一个OnPageChangeListener,然后在具体的方法中判断当前页面的编号,并改变相应的title颜色。

接下来我遇到的第一个麻烦,我该如何确定

的高度呢?(百度一下“gridview 高度”,发现好多人遇到这个问题)

显然我是没有办法使用“硬编码”的方式来实现的,因为android设备的屏幕分辨率太多,屏幕比例也很多奇葩的。

最后我只能通过动态计算的方式来实现:

第一个dp与px的转化,dp(也叫dip density-independent pixels),引入这个单位的原因应该是考虑到屏幕分辨率的原因,比如同一个100px * 100px的控件,在相同尺寸分辨率为320p和1080p上看,大小相差很多的。而px与dp是存在一定的比例关系的,如果分辨率为160,那么就是 1px = 1dp。如果分辨率为240,就是1.5px = 1dp。具体的换算和理详细的介绍,请自选百度。

在代码在,我们只需要getResources().getDisplayMetrics().density,就可以获得这个比例系数了。

ListView其实没什么好说的,基本上都是通过的写法了,写过一次就知道怎么用了~~~

SlidingMenu的使用,github上的SlidingMenu是很容易用的,官方的Demo也相当给力。看一下再试一下,基本知道怎么用了。比如在我的工程中:

自定义进度条:

进度条和按钮不同,它是有两层的,使用的是layer-list这种drawable文件。它根据id来设置到不同的位置:

关于SlidingMenu的使用:

SlidingMenu是一个库项目,在我们的项目中引用,只需要在Properties中Add即可。

源码下载:

http://pan.baidu.com/share/link?shareid=1000621439&uk=1812042723

【转载】http://www.cnblogs.com/yjiyjige/p/3308139.html

高仿360云盘android端的ui实现,高仿360云盘android端的UI实现相关推荐

  1. android手机安全卫士源码高仿360安全卫士

    下载地址:http://download.csdn.net/detail/lengyanyue2014/7993363 运行截图: 源码目录 │  .classpath │  .project │   ...

  2. android 调出键盘表情_android高仿微信表情输入与键盘输入代码(详细实现分析)

    表情与键盘的切换输入大部分IM都会需要到,之前自己实现了一个,还是存在些缺陷,比如说键盘与表情切换时出现跳闪问题,这个困扰了我些时间,不过所幸在Github(其代码整体结构很不错)并且在论坛上找些解决 ...

  3. mysql修改元宝,端游[君·天下]高仿魔兽世界一键启动服务端+配套客户端+元宝金币修改教程等...

    资源说明: 1.本资源为君·天下OL单机版一键启动服务端,此游戏高仿魔兽世界. 2.四大职业:武修.羽箭.仙道.真巫. 3.慈善系统.变身系统.召唤系统.动态副本-单人进入.配对系统.狩猎时装.商城. ...

  4. 百度,360,淘宝,腾讯,高通中国,htc上海 Android 面试题

    备注:这些是我为准备面试在网上看到的,觉得还可以,挺有代表性的题目,暂且放这吧...   这些题我都认真的看过一遍,有个别的不会,基本还算简单,下面标绿颜色的是我目前不是特别会的,今天务必查一下答案. ...

  5. Android ActionBar应用实战,高仿微信主界面的设计

    转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/26365683 经过前面两篇文章的学习,我想大家对ActionBar都已经有一个相对 ...

  6. 三维点云可以导航吗_基于视觉高精定位的“室内AR导航”技术点解析

    自1967年卫星导航技术开放民用以来,经过50多年发展,导航定位已广泛应用于交通物流.地理信息.高精度测量等多种行业中,提升了现代社会的运营效率,也为个人生活和出行都带来巨大便利. 不过,尽管导航定位 ...

  7. 腾讯Techo开发者大会揭晓云存储发展趋向:高性能、高可用、高性价比

    产业数字化转型过程中产生着比过去任何一个时代都多的数据.在这样的背景下,数据存储技术应该怎么发展?11月7日,在腾讯Techo开发者大会上,来自科研领域的专家和腾讯云存储业务的工程师们共同揭开了云存储 ...

  8. Android 天气APP(十三)仿微信弹窗(右上角加号点击弹窗效果)、自定义背景图片、UI优化调整

    上一篇:Android 天气APP(十二)空气质量.UI优化调整 天气预报详情,逐小时预报详情 新版------------------- 一.适配器点击监听 二.页面实现 三.天气预报详情弹窗 四. ...

  9. 关于Android安卓APP保活 - 安卓消息推送详解 - 安卓端外推送离线推送

    转自:http://zhangtielei.com/posts/blog-android-push.html 说Android端外推送比较烦,实际有两层意思:首先是说实现上比较麻烦,至今业界也没有找到 ...

  10. 白熊云盘:一款免费无限速的5T网盘

    白熊云盘:一款免费无限速的5T网盘 今天在不死鸟大佬博客看到这个免费5t的不限速网盘,于是乎注册了几个号耍耍,用了一番还挺不错的,这里给大家推荐一下. 网盘主界面 这个是登陆后主界面,目测有点像owo ...

最新文章

  1. 沉默不是一个好的选择
  2. matlab的实用与仿真,MATLAB建模与仿真实用教程
  3. 文巾解题 695. 岛屿的最大面积
  4. Python编程基础:第三十七节 石头剪刀布游戏Rock, Paper, Scissors Game
  5. reactjs组件的生命周期:创建时和更新时
  6. 02-NVIDIA Jetson TX2 通过JetPack 3.1刷机完整版(踩坑版)
  7. (26)ESLint一JS代码格式校验
  8. 赵云传 java游戏_三国赵云传2RPG版
  9. Python入门第三章--第三节:列表
  10. HTML5期末大作业:旅游网页设计与实现——旅游风景区网站HTML+CSS+JavaScript 景点静态网页设计 学生DW静态网页设计
  11. 一年级上册计算机教学计划,一年级信息技术上册教学计划
  12. 14《游戏化思维》-豆瓣评分7.0
  13. C编译错误,运行错误以及常见问题。
  14. 网络爬虫:网页信息获取
  15. redirect-重定向
  16. 教你如何用好MindMapper
  17. 【随手记】fatal: cannot do a partial commit during a merge. 解决
  18. 统计数据集图片通道的像素均值和方差
  19. HEL-X8II型便携式电流互感器检定装置
  20. Download: Microsoft Access Database Engine 2010 Redistributable

热门文章

  1. 计算机五笔教学软件,指法练习 XP
  2. html 页眉选项卡,连续两个奇数页页眉 再选择插入菜单——分页,执行2次
  3. 英语学习/词典App分析-团队作业(五)
  4. 携创教育:自考英语二相当于什么水平?可以不考吗?
  5. NB-IOT经典案例
  6. wex5 页面跳转
  7. 大猫谈JNCIE实验考试备战
  8. 用userAgent判断手机类型
  9. 2020CCPC 威海 G Caesar Cipher
  10. python趋势图_python绘制趋势图的示例