学习笔记—— 微信5.x 界面
来源:互联网 发布:商品数据库设计 编辑:程序博客网 时间:2024/05/16 05:40
看了这样一个视频课程:http://www.imooc.com/learn/198
之前从未觉得,编写界面哪里有趣,最近尝试了一下,还是挺好玩的。之前写过的多数应用都是 最基本的 按钮+文字,本着功能实现了就好。
微信5.X的界面,主体是一个webView, 实现了通过滑动切换界面的效果;每一个界面布局,又由一个Fragment 设置。整体效果如下:
此次新学到的知识点有:
1)MainActivity.XML 的布局文件,通过可通过引用其他布局文件构成。这样布局文件更具条理性,避免代码臃肿难读;
具体操作如下:
<include layout="@layout/top1" /><include layout="@layout/top2" />2)图中“聊天”tab下的绿色线条被称为指示器,其实是一个背景色为绿色的ImageView,被布局在tabText下面,长度占屏幕1/4, 通过重写onPageScrolled()实现指示器动作;
视频中,视频作者采用了一种较为复杂的方式,重写这个方法。其大致思想是,先判断指示器位置,再执行滑动动作。该作者用了整整20min来分析他的方法
我认为这是没必要的,我的方法简单的多,只有三行代码:
@Overridepublic void onPageScrolled(int position, float positionOffset,int positionOffsetPx) {// Log.e("TAG",// position+";"+positionOffset+";"+positionOffsetPx+"/n");left = position * mScreen1_3 + positionOffsetPx / 3;indicatorlayoutParams.leftMargin = left;mIndicator.setLayoutParams(indicatorlayoutParams);}
暂时没发现这种实现有什么不妥。
3)[BadgeView] 是一个消息数目指示器,来自于gitGub上的一个开源包,只需要在 项目>properties>Android Tab中增加该包作为引用即可。
@注意: 该包含有android-support-v4.jar(Android Private Libraries) 包,因此会和项目目录下 libs下的默认android-support-v4.jar 包冲突,因此应删除libs下的包,否则会提示引用错误。
我之前都不这样引用项目,我都是直接把要引用的包拷贝到我的项目文件夹下,当然这样应该也是可以的。
我直接在XML 中添加了 BadgeView 这个组件:
<com.jauker.widget.BadgeView android:id="@+id/badgeview_chat" android:layout_width="wrap_content" android:layout_height="wrap_content" />
然后在.java 中直接调用public 的方法设置消息条数:
mBadgeView = (BadgeView) findViewById(R.id.badgeview_chat);mBadgeView.setBadgeCount(7);当然,BadgeView 中有一系列方法,这个在原文件中都有很好的注视,使用也显而易见;BadgeView实际上继承了TextView,实际上是一个重绘了背景的数字TextView;
视频中在.java 中new 出一个BadgeView,然后再add 到相应组件上,我不喜欢这中方式。因为这样不够直观,也没有很好的实现布局和控制 代码的分离;
4)LayoutParams 的使用。 在一些view 没有实现与Xml对应的参数Set方法是,一般要通过Layout.SetLayoutParams实现。如(2)中的代买,通过ImageView
mIndicator [夫组件] LinearLayout 的 LayoutParams 来设置 ImageView 的 MarginLeft 属性;
@注意:夫组件!!
- 学习笔记—— 微信5.x 界面
- 微信6.0界面学习笔记
- Cocos2d-x学习笔记(五)—— 常见UI界面(未完全)
- 微信学习笔记
- weui学习总结——3、微信样式界面切换
- 微信6.0界面开发学习
- yii2学习笔记——yii2引入微信API
- HTML——eeasyUi界面学习笔记
- Duilib学习笔记《02》— 界面布局
- Duilib学习笔记《02》— 界面布局
- Duilib学习笔记《02》— 界面布局
- Duilib学习笔记《02》— 界面布局
- Duilib学习笔记《02》— 界面布局
- Duilib学习笔记《02》—界面布局
- Cocos2d-X 学习笔记 22 CCLayer 界面Touch事件处理
- 微信登录学习笔记
- 微信mars学习笔记
- 学习笔记-微信支付
- Apache Tiles 布局管理器
- DAY_1
- 美语音标 [ɪ]在下列情况要发[i]的音
- spinlock
- 图的遍历(BFS、DFS的邻接矩阵和邻接表实现)
- 学习笔记—— 微信5.x 界面
- 面向对象的四大基本特性
- hdu 2896 ac自动机
- NYOJ216--A problem is easy【数学】
- rtcp.py与lcx配合转发3389端口,速度远好于80端口的socks反向代理
- 初学Eclipse笔记
- 1004. Counting Leaves (30)
- Expanding Rods(数学公式推导+二分)
- UITableView的使用大全