仿新浪微博客户端--界面设计(1)
仿新浪微博客户端--界面设计(1)
2013年9月16日新浪微博客户端继续开发
其实这些页面已经做好很久了,因为一直有其他事情要做,所以没太多时间发博客。关于新浪微博客户端的界面我想玩过微博的人都比较熟悉了,新版的客户端界面也发生了很大的变化,我这里也无法做到面面俱到,只能参考着来做咯。事先说明,一本人不太会美工,二这个项目只能当作参考,也是作为小巫学习的一个途径。各位有啥问题,自己想法子解决哈。
先来尝尝鲜吧:
以上五个界面就是主界面的效果图啦,布局其实并不复杂就是有点繁琐罢了,一般由三部分组成,顶部是标题栏,中间是显示列表或内容部分,底部是tabbar栏。
下面一个一个界面来说:
首先介绍底部的tabbar吧
/Wwj_sina_weibo/res/layout/tabbar.xml
<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/more_title_layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/titlebar_bg_nor" > <TextView android:id="@+id/tv_more_name" android:layout_width="200dp" android:layout_height="wrap_content" android:layout_gravity="center" android:gravity="center" android:text="@string/more" android:textColor="@color/title_text_color" android:textSize="@dimen/title_text_size" /> <FrameLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="right|center_vertical" > <ProgressBar android:id="@+id/titleprogressBar" style="?android:attr/progressBarStyleLarge" android:layout_width="30dip" android:layout_height="30dip" android:indeterminateDrawable="@drawable/progressbar" android:visibility="gone" /> <ImageView android:id="@+id/title_bt_right" android:layout_width="wrap_content" android:layout_height="wrap_content" android:contentDescription="@string/empty"/> </FrameLayout></FrameLayout>
关于主界面的设计就这么些代码了,好像蛮多的,其实完全可以发挥你自己的想象力,把原型做出来。我这里也是为了开发方便,界面不会做太多修改,等之后能获取到微博数据,再考虑美化界面。