Android UI手机信息页面设计

本文实例为大家分享了Android UI 手机信息页面展示的具体代码,供大家参考,具体内容如下

1. 运行效果图

2. 设计思路(实现原理)

1.将准备好的八个图标复制到res/drawable文件夹下
2.创建一个垂直的线性布局,并在线性布局中创建4个相对布局
3.在相对布局中添加相应的TextView
4.在values文件下的style.xml文件中存放抽取出来的样式
5.创建values-zh-rCN、values-en-rUS文件夹,并在文件夹中创建strings.xml文件夹

3.案例实现

(1)创建“手机信息页面”程序

创建一个名为“手机信息页面”的程序,该程序用于展示手机设置页面的信息。程序界面对应布局文件activity_mian.xml如下所示:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="@android:color/darker_gray"
 android:orientation="vertical"
 tools:context=".MainActivity" >
 <RelativeLayout style="@style/h_wrap_content"
  android:layout_marginTop="10dp">
  <TextView
   style="@style/tv_style"
   android:layout_alignParentLeft="true"
   android:layout_marginLeft="10dp"
   android:drawableTop="@drawable/clound"
   android:text="@string/_cloud" />
  <TextView
   style="@style/tv_style"
   android:layout_alignParentRight="true"
   android:layout_marginRight="10dp"
   android:drawableTop="@drawable/bluetooth"
   android:text="@string/_bluetooth" />
 </RelativeLayout>
 <RelativeLayout style="@style/h_wrap_content"
  android:layout_marginTop="10dp">
  <TextView
   style="@style/tv_style"
   android:layout_alignParentLeft="true"
   android:layout_marginLeft="10dp"
   android:drawableTop="@drawable/gesture"
   android:text="@string/_gesture" />
  <TextView
   style="@style/tv_style"
   android:layout_alignParentRight="true"
   android:layout_marginRight="10dp"
   android:drawableTop="@drawable/gps"
   android:text="@string/_gps" />
 </RelativeLayout>
 <RelativeLayout style="@style/h_wrap_content"
  android:layout_marginTop="10dp">
  <TextView
   style="@style/tv_style"
   android:layout_alignParentLeft="true"
   android:layout_marginLeft="10dp"
   android:drawableTop="@drawable/info"
   android:text="@string/_system_info" />
  <TextView
   style="@style/tv_style"
   android:layout_alignParentRight="true"
   android:layout_marginRight="10dp"
   android:drawableTop="@drawable/internet"
   android:text="@string/_internet" />
 </RelativeLayout>
 <RelativeLayout style="@style/h_wrap_content"
  android:layout_marginTop="10dp">
  <TextView
   style="@style/tv_style"
   android:layout_alignParentLeft="true"
   android:layout_marginLeft="10dp"
   android:drawableTop="@drawable/language"
   android:text="@string/_language" />
  <TextView
   style="@style/tv_style"
   android:layout_alignParentRight="true"
   android:layout_marginRight="10dp"
   android:drawableTop="@drawable/notifycation"
   android:text="@string/_set_notifycation" />
 </RelativeLayout>
 </LinearLayout>

(2)抽取样式

由于编写布局文件时,相同控件之间的外边距和宽高都是固定的。因此会产生大量重复的布局代码,为了代码简洁和重复使用可以将相同代码抽取为样式单独放在一个styles.xml文件中。一般情况下 在app的vlaue文件夹下会自带一个styles.xml文件styles.xml文件如下所示:

<resources>
 <style name="AppBaseTheme" parent="android:Theme.Light">
 </style>
 <style name="AppTheme" parent="AppBaseTheme">
 </style>
 <!-- 宽 match——parent 高 wrap_content-->
 <style name="h_wrap_content">
  <item name="android:layout_width">match_parent</item>
  <item name="android:layout_height">wrap_content</item>
 </style>
  <!-- 宽高都 match——parent -->
 <style name="tv_style">
  <item name="android:layout_width">145dp</item>
  <item name="android:layout_height">90dp</item>
  <item name="android:gravity">center</item>
  <item name="android:paddingTop">8dp</item>
  <item name="android:paddingBottom">8dp</item>
  <item name="android:drawablePadding">5dp</item>
  <item name="android:background">@android:color/white</item>
 </style>
</resources> 

(3)创建values-zh-rCN、values-en-rUS文件夹

切换到project打开MyApplication->app->src->main->res,创建values-zh-rCN、values-en-rUS文件夹,并在这两个文件夹下创建相应的strings.xml文件。

values-zh-rCN文件夹下的strings.xml文件如下所示:

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <string name="app_name">手机信息页面</string>
 <string name="menu_settings">设置</string>
 <string name="hello_world">你好,世界!</string>
 <string name="_cloud">云通信</string>
 <string name="_bluetooth">蓝牙</string>
 <string name="_gesture">自定义手势</string>
 <string name="_gps">定位</string>
 <string name="_system_info">系统信息</string>
 <string name="_internet">网络</string>
 <string name="_language">语言设置</string>
 <string name="_set_notifycation">通知栏设置</string>
</resources>

values-en-rUS文件夹下的strings.xml文件如下所示:

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <string name="app_name">phoneInfo</string>
 <string name="menu_settings">Settings</string>
 <string name="hello_world">Hello world!</string>
 <string name="_cloud">Cloud</string>
 <string name="_bluetooth">Bluetooth</string>
 <string name="_gesture">Gesture</string>
 <string name="_gps">Gps</string>
 <string name="_system_info">SystemInfo</string>
 <string name="_internet">Internet</string>
 <string name="_language">Language</string>
 <string name="_set_notifycation">Notifycation</string>
</resources>

你会看到如下效果:

(4)编写与界面交互的代码

接下来需要在MainActivity中编写与用户交互的逻辑代码,MainActivity对应的代码如下所示:

public class MainActivity extends AppCompatActivity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
  }
}

(5)查看运行结果


各控件及其属性可根据情况进行修改。

(0)

相关推荐

  • 解析Android开发优化之:对界面UI的优化详解(二)

    如果我们在每个xml文件中都把相同的布局都重写一遍,一个是代码冗余,可读性很差:另一个是修改起来比较麻烦,对后期的修改和维护非常不利.所以,一般情况下,我们需要把相同布局的代码单独写成一个模块,然后在用到的时候,可以通过<include /> 标签来重用layout的代码. 常见的,有的应用在最上方会有一个标题栏.类似下图所示. 图 标题栏的示例 如果项目中大部分Activity的布局都包含这样的标题栏,就可以把标题栏的布局单独写成一个xml文件. 复制代码 代码如下: <Relativ

  • Android自定义手机界面状态栏实例代码

    前言 我们知道IOS上的应用,状态栏的颜色总能与应用标题栏颜色保持一致,用户体验很不错,那安卓是否可以呢?若是在安卓4.4之前,答案是否定的,但在4.4之后,谷歌允许开发者自定义状态栏背景颜色啦,这是个不错的体验!若你手机上安装有最新版的qq,并且你的安卓SDK版本是4.4及以上,你可以看下它的效果: 实现这个效果有两个方法: 1.在xml中设置主题或自定义style: Theme.Holo.Light.NoActionBar.TranslucentDecor Theme.Holo.NoActi

  • 详解Android 手机卫士设置向导页面

    推荐阅读: 浅析Android手机卫士自定义控件的属性 浅析Android手机卫士关闭自动更新 设置向导页面,通过SharedPreferences来判断是否已经设置过了,跳转到不同的页面 自定义样式 在res/values/styles.xml中 添加节点<style name="">,设置名称属性 在<style>节点里面,添加节点<item name="">设置名称属性,就是布局的各种参数 在<item>的文本里

  • Android获取手机通讯录、sim卡联系人及调用拨号界面方法

    android获取手机通讯录联系人信息 复制代码 代码如下: private void getPhoneContacts() {        ContentResolver resolver = this.getContentResolver();                // 获取手机联系人       Cursor phoneCursor = resolver.query(Phone.CONTENT_URI,                  new String[] { Phone

  • 解析Android开发优化之:对界面UI的优化详解(一)

    通常,在这个页面中会用到很多控件,控件会用到很多的资源.Android系统本身有很多的资源,包括各种各样的字符串.图片.动画.样式和布局等等,这些都可以在应用程序中直接使用.这样做的好处很多,既可以减少内存的使用,又可以减少部分工作量,也可以缩减程序安装包的大小. 下面从几个方面来介绍如何利用系统资源. 1)利用系统定义的id 比如我们有一个定义ListView的xml文件,一般的,我们会写类似下面的代码片段. 复制代码 代码如下: <ListView android:id="@+id/m

  • Android仿Win8的metro的UI界面(上)

    手机下载了一些APP,发现现在仿win8的主界面越来越多,在大家见惯了类GridView或者类Tab后,给人一种耳目一新的感觉.今天在eoe上偶然发现已经有人实现了这个功能的源码(地址:http://www.eoeandroid.com/forum.php?mod=viewthread&tid=327557),马上下载跑了一下,效果很炫,但是有些bug,比如点击速度特别快时图像会被放大,以及点击时会触发两次点击事件. 本例子基于eoe中这位大神的实现,做了一些简化,和bug的修复. 效果: 首先

  • Android UI手机信息页面设计

    本文实例为大家分享了Android UI 手机信息页面展示的具体代码,供大家参考,具体内容如下 1. 运行效果图 2. 设计思路(实现原理) 1.将准备好的八个图标复制到res/drawable文件夹下 2.创建一个垂直的线性布局,并在线性布局中创建4个相对布局 3.在相对布局中添加相应的TextView 4.在values文件下的style.xml文件中存放抽取出来的样式 5.创建values-zh-rCN.values-en-rUS文件夹,并在文件夹中创建strings.xml文件夹 3.案

  • Android 获取手机信息实例详解

    Android 获取手机信息 应用信息:包名.版本号.版本名,手机是否有Root权限 手机信息:手机屏幕宽和高.当前可用内存大小.总内存大小.IMEI号.IESI号.手机型号.手机品牌.手机MacAdd.CPU型号.CPU频率 开门见山,以下是Java代码,XML只有一个TextView显示信息. package com.example.getphoneinfo; import java.io.BufferedReader; import java.io.File; import java.io

  • Android获取手机信息的工具类

    网上收集的一些获取收集信息的代码,制作成一个工具类,以后可以方便调用. import java.io.BufferedReader; import java.io.FileReader; import java.io.IOException; import android.app.Activity; import android.content.Context; import android.content.pm.ApplicationInfo; import android.content.p

  • Android UI设计系列之自定义ViewGroup打造通用的关闭键盘小控件ImeObserverLayout(9)

    转载请注明出处:http://blog.csdn.net/llew2011/article/details/51598682 我们平时开发中总会遇见一些奇葩的需求,为了实现这些需求我们往往绞尽脑汁有时候还茶不思饭不香的,有点夸张了(*^__^*)--我印象最深的一个需求是在一段文字中对部分词语进行加粗显示.当时费了不少劲,不过还好,这个问题最终解决了,有兴趣的童靴可以看一下:Android UI设计之<六>使用HTML标签,实现在TextView中对部分文字进行加粗显示. 之前产品那边提了这样

  • Android获取手机屏幕宽高、状态栏高度以及字符串宽高信息的方法

    本文实例讲述了Android获取手机屏幕宽高.状态栏高度以及字符串宽高信息的方法.分享给大家供大家参考.具体如下: 首先定义TextView对象commentText 获取文字的宽高: TextPaint textPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG); textPaint.setTextSize(commentText.getTextSize()); textPaint.setColor(Color.WHITE); FontMetrics fo

  • Android获取手机SIM卡运营商信息的方法

    本文实例讲述了Android获取手机SIM卡运营商信息的方法,对于Android程序设计有非常实用的价值.分享给大家供大家参考之用.具体方法如下: 主要功能代码如下: /** * 获取SIM卡运营商 * * @param context * @return */ public static String getOperators(Context context) { TelephonyManager tm = (TelephonyManager) context .getSystemServic

  • Android UI设计系列之自定义ListView仿QQ空间阻尼下拉刷新和渐变菜单栏效果(8)

    好久没有写有关UI的博客了,刚刚翻了一下之前的博客,最近一篇有关UI的博客:Android UI设计系列之自定义Dialog实现各种风格的对话框效果(7) ,实现各种风格效果的对话框,在那篇博客写完后由于公司封闭开发封网以及其它原因致使博客中断至今,中断这么久很是惭愧,后续我会尽量把该写的都补充出来.近来项目有个需求,要做个和QQ空间类似的菜单栏透明度渐变和下拉刷新带有阻尼回弹的效果.于是花点时间动手试了试,基本上达到了QQ空间的效果,截图如下: 通过观察QQ空间的运行效果,发现当往上滚动时菜单

  • Android获取手机系统版本等信息的方法

    本文实例讲述了Android获取手机系统版本等信息的方法.分享给大家供大家参考.具体如下: String phoneInfo = "Product: " + android.os.Build.PRODUCT; phoneInfo += ", CPU_ABI: " + android.os.Build.CPU_ABI; phoneInfo += ", TAGS: " + android.os.Build.TAGS; phoneInfo += &qu

  • Android获取手机的版本号等信息的代码

    本文实例分享了Android获取手机系统版本等信息的方法,供大家参考,具体内容如下: 第一种代码: String phoneInfo = "Product: " + android.os.Build.PRODUCT; phoneInfo += ", CPU_ABI: " + android.os.Build.CPU_ABI; phoneInfo += ", TAGS: " + android.os.Build.TAGS; phoneInfo +=

  • android 获取手机GSM/CDMA信号信息,并获得基站信息的方法

    在Android中我们常用的轻松获取WIFI信号列表,那如何获取CDMA或者GSM的手机信号呢? 系统提供了TelephonyManager类,此类非常丰富,基本你所需要的手机信息都能获取到,那下面就来看看我们所需要的CDMA与GSM信号是如何获取的吧. private TelephonyManager telephonyManager; private PhoneStateListener phoneStateListener; 首先声明两个变量 在onCreate()方法中初始化变量 Ini

随机推荐