Metro风格的Android界面应用
2013-11-21 23:40
288 查看
最近项目中需要一个选择月份查询客户余额的功能,原先的android只能满足查询当月,不可以查询任意月份。当然改起来还是很简单的,服务端增加一个月份参数,客户端传入这个参数即可。闲来无事,月份的选择风格不如做成Metro风格的,现在不是流行扁平化吗,况且我又是微软的忠实粉丝,最近工作没找到,静下心来学学东西,做做实验还是挺好的。
![](http://images.cnitblog.com/blog/561372/201311/21232846-40136ac8f37442ba9de536674b8fb39a.jpg)
现在把核心布局文件写出来
每个模块的样式(其实还有很多重复的可以写到样式文件里)
java 文件
基本上就这些了。其实还可以做得更好一点,比如按下的时候有一个稍微变小的变化。
![](http://images.cnitblog.com/blog/561372/201311/21232846-40136ac8f37442ba9de536674b8fb39a.jpg)
现在把核心布局文件写出来
<?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/scrollView1" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical" > <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_marginTop="5dp" android:gravity="center_horizontal" > <LinearLayout style="@style/menu_item_block_orange" > <TextView android:text="一月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/yiyue" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp" > <TextView android:text="二月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/eryue" /> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_marginTop="5dp" android:gravity="center_horizontal" > <LinearLayout style="@style/menu_item_block_orange" > <TextView android:text="三月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/sanyue" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp"> <TextView android:text="四月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/siyue" /> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_marginTop="5dp" android:gravity="center_horizontal" > <LinearLayout style="@style/menu_item_block_orange" > <TextView android:text="五月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/wuyue" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp"> <TextView android:text="六月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/liuyue" /> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_marginTop="5dp" android:gravity="center_horizontal" > <LinearLayout style="@style/menu_item_block_orange" > <TextView android:text="七月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/qiyue" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp"> <TextView android:text="八月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/bayue" /> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_marginTop="5dp" android:gravity="center_horizontal" > <LinearLayout style="@style/menu_item_block_orange" > <TextView android:text="九月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/jiuyue" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp"> <TextView android:text="十月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/shiyue" /> </LinearLayout> </LinearLayout> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_marginTop="5dp" android:gravity="center_horizontal" > <LinearLayout style="@style/menu_item_block_orange" > <TextView android:text="十一月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/shiyiyue" /> </LinearLayout> <LinearLayout style="@style/menu_item_block_orange" android:layout_marginLeft="5dp"> <TextView android:text="十二月" android:clickable="true" android:textSize="20dp" android:textColor="@color/white" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center_vertical|center_horizontal" android:id="@+id/shieryue" /> </LinearLayout> </LinearLayout> </LinearLayout> </ScrollView>
每个模块的样式(其实还有很多重复的可以写到样式文件里)
<style name="menu_item_block_orange"> <item name="android:background">@color/blue</item> <item name="android:layout_width">130dp</item> <item name="android:layout_height">130dp</item> </style>
java 文件
package com.example.crazy; import android.os.Bundle; import android.app.Activity; import android.content.Intent; import android.view.Menu; import android.view.View; import android.view.View.OnClickListener; import android.widget.TextView; public class MonthActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_month); ((TextView)findViewById(R.id.yiyue)).setOnClickListener(l); ((TextView)findViewById(R.id.eryue)).setOnClickListener(l); ((TextView)findViewById(R.id.sanyue)).setOnClickListener(l); ((TextView)findViewById(R.id.siyue)).setOnClickListener(l); ((TextView)findViewById(R.id.wuyue)).setOnClickListener(l); ((TextView)findViewById(R.id.liuyue)).setOnClickListener(l); ((TextView)findViewById(R.id.qiyue)).setOnClickListener(l); ((TextView)findViewById(R.id.bayue)).setOnClickListener(l); ((TextView)findViewById(R.id.jiuyue)).setOnClickListener(l); ((TextView)findViewById(R.id.shiyue)).setOnClickListener(l); ((TextView)findViewById(R.id.shiyiyue)).setOnClickListener(l); ((TextView)findViewById(R.id.shieryue)).setOnClickListener(l); } private OnClickListener l=new OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub switch(((TextView)v).getId()){ case R.id.yiyue: gotowebview("1"); break; case R.id.eryue: gotowebview("2"); break; case R.id.sanyue: gotowebview("3"); break; case R.id.siyue: gotowebview("4"); break; case R.id.wuyue: gotowebview("5"); break; case R.id.liuyue: gotowebview("6"); break; case R.id.qiyue: gotowebview("7"); break; case R.id.bayue: gotowebview("8"); break; case R.id.jiuyue: gotowebview("9"); break; case R.id.shiyue: gotowebview("10"); break; case R.id.shiyiyue: gotowebview("11"); break; case R.id.shieryue: gotowebview("12"); break; default:break; } } }; private void gotowebview(String month){ Identity.month=month;//Identity是我自定义的存放全局变量的类 Intent it = new Intent(MonthActivity.this, MyAccount.class); startActivity(it); } }
基本上就这些了。其实还可以做得更好一点,比如按下的时候有一个稍微变小的变化。
相关文章推荐
- 使用 Fries 创建性感的 Android 风格移动应用界面
- Android 应用界面风格与主题(style and theme)
- 将win8 Metro风格界面开始菜单转换成win7样式具体操作步骤
- Android应用开发中的风格和主题(style,themes)
- 二、Android应用的界面编程(二)布局管理器
- Android开发之Intent跳转到系统应用中的拨号界面、联系人界面、短信界面
- 创建Material Design风格的Android应用--应用主题
- Android 仿 窗帘效果 和 登录界面拖动效果 (Scroller类的应用) 附 2个DEMO及源码
- Metro风格界面
- android setting 界面风格修改
- Android移动应用界面的模板化设计
- 创建Material Design风格的Android应用--应用主题
- 【转发】Android Metro风格的Launcher开发系列第一篇
- Android Metro风格的Launcher开发系列第一篇
- Android应用界面开发——Handler(实现倒计时)
- Android 仿 窗帘效果 和 登录界面拖动效果 (Scroller类的应用) 附 2个DEMO及源码
- 浅析 android 应用界面的展现流程(一)周期函数
- Android开发之Intent跳转到系统应用中的拨号界面、联系人界面、短信界面
- Android应用界面开发_学习笔记_第二周
- Android 仿PhotoShop调色板应用(三) 主体界面绘制