android 安卓 微信布局 [1]

微信布局    

直接上代码吧

---------------------------------------- 头部 -----------------------------------------------

项目 /res/layout 目录下 创建 head.xml 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:background="#21292c"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:fontFamily="@string/kti"
        android:padding="10dp"
        android:text="@string/name"
        android:textColor="#ffffff"
        android:textSize="16sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center" >

        <ImageView
            android:id="@+id/imageView1"
            style="@style/headStyle"
            android:layout_marginRight="30dp"
            android:src="@drawable/fdj" />

        <ImageView
            android:id="@+id/imageView2"
            style="@style/headStyle"
            android:layout_marginRight="10dp"
            android:src="@drawable/barbuttonicon_add" />
    </LinearLayout>

</LinearLayout>

 复制粘贴到自己的项目 发现好多好多的     报编译错误╭(╯^╰)╮

带@什么什么的大多都有配    (良心配方 ☞   (￣△￣；)   )

不急 不急   先来一个一个解决吧   (￣m￣)

项目  下res 文件下 values 文件下 strings.xml 文件  

(看到就打开复制粘贴   没看到ㄟ( ▔, ▔ )ㄏ   就在values下面创建一个 strings.xml 文件    .xml   文件啊(σ｀д′)σ)

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">winxinmff微信界面</string>
    <string name="hello_world">Hello world!</string>
    <string name="action_settings">Settings</string>
    <string name="name">微信</string>
    <string name="tongxl">通讯录</string>
    <string name="tabbar">发现</string>
    <string name="ewo">我</string>
    <string name="kti">楷体</string>

</resources>

 项目 下res文件下 values文件下 styles.xml 文件

(还是那句话 看的就复制粘贴)

<resources xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- Base application theme, dependent on API level. This theme is replaced
        by AppBaseTheme from res/values-vXX/styles.xml on newer devices.    -->
    <style name="AppBaseTheme" parent="android:Theme.Light">
        <!-- Theme customizations available in newer API levels can go in res/values-vXX/styles.xml, 
            while customizations related to backward-compatibility can go here.
        -->
    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
    </style>

    <style name="radioStyle">
        <item name="android:button">@null</item>
        <item name="android:layout_weight">1</item>
        <item name="android:gravity">center</item>
        <item name="android:textColor">@drawable/text_color</item>
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:layout_marginTop">5dp</item>
        <item name="android:layout_marginBottom">5dp</item>
        <item name="android:textSize">9sp</item>
        <item name="android:drawablePadding">5sp</item>        
    </style>

    <style name="headStyle">
        <item name="android:layout_width">32dp</item>
        <item name="android:layout_height">22dp</item>
    </style>

</resources>

 项目下 /res/drawable-hdpi/text_color.xml 文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_checked="true" android:color="@color/green"></item>
    <item android:state_checked="false" android:color="@color/grey"></item>

</selector>

那啥  和  这玩意还有 是吧

 

这是图片   有几张是透明图片    自己看着办吧

如：

自己用鼠标拖拉一下就知道了

会用 git 的   可以去下面这个链接里面用 git clone 命令 下载图片

https://github.com/littleSeven7/sevenTeam   这个链接是它里面的图片    

  

不管用什么方法下载下来

把图片放在 项目/res/drawable-hdpi下面   它会自动生成R文件

   名字什么的就自己改改啦 <(￣︶￣)> 

头部的版就排成这样呐  o(￣ヘ￣o#)  感觉也不容易啊    （希望以后还看得懂）

排完头部   那就排底部   (先说好    自我感觉它比较麻烦 (ಥ _ ಥ) )

---------------------------------------- 底部 -----------------------------------------------

项目下 /res/layout/bottom.xml 文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <RadioGroup
        android:id="@+id/radioButton1"
        android:layout_width="match_parent"
        android:layout_height="55dp"
        android:background="@drawable/group_buton_nomal"
        android:gravity="center"
        android:orientation="horizontal"
         >

        <RadioButton
            android:id="@+id/radioButton2"
            style="@style/radioStyle"
            android:checked="true"
            android:drawableTop="@drawable/tab_weixin"
            android:text="@string/name" />

        <RadioButton
            android:id="@+id/radioButton3"
            style="@style/radioStyle"
            android:drawableTop="@drawable/tab_set"
            android:text="@string/tongxl" />

        <RadioButton
            android:id="@+id/radioButton4"
            style="@style/radioStyle"
            android:drawableTop="@drawable/tab_find"
            android:text="@string/tabbar" />

        <RadioButton
            android:id="@+id/radioButton5"
            style="@style/radioStyle"
            android:drawableTop="@drawable/tab_sddre"
            android:text="@string/ewo" />
    </RadioGroup>
    

</LinearLayout>

 项目下/res/drawable-hdpi/tab_weixin.xml文件 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item  android:drawable="@drawable/tabbar_mainframe" android:state_checked="false"></item>
    <item  android:drawable="@drawable/tabbar_mainframehl" android:state_checked="true"></item>
    <!--  -->

</selector>

 项目下/res/drawable-hdpi/tab_set.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/tabbar_contacts" android:state_checked="false"></item>
    <item android:drawable="@drawable/tabbar_contacts_hl" android:state_checked="true"></item>
    <!--  -->


</selector>

项目下/res/drawable-hdpi/tab_sddre.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <item android:drawable="@drawable/tabbar_me" android:state_checked="false"></item>
    <item android:drawable="@drawable/tabbar_mehl" android:state_checked="true"></item>

</selector>

项目下/res/drawable-hdpi/tab_find.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
     <item android:drawable="@drawable/tabbar_discover" android:state_checked="false"></item>
    <item android:drawable="@drawable/tabbar_discoverhl" android:state_checked="true"></item>
    <!--  -->


</selector>

底部就好了 <(￣︶￣)>

 
---------------------------------------- 组拼 -----------------------------------------------

 下面   就是   把它们两个拼凑起来  ◔ ‸◔?

 项目下/res/layout/weixin.xml 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <include
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            layout="@layout/head" />
    </LinearLayout>
    <!-- 中间 -->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical" >
    </LinearLayout>
    <!-- 中间 -->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <include layout="@layout/bottom" />
    </LinearLayout>

</LinearLayout>

这就就好了◔ ‸◔?

到这    算是好了吧  

项目 下/什么什么Manifest.xml  清单文件里面

android:theme="@style/AppTheme"   这一行代码改下面的

 android:theme="@android:style/Theme.DeviceDefault.Light.NoActionBar"

这是去   最上面那个黑色部分的    （运行是时候去除)

可以自己在加加工  让它好看的点

 

感觉还是好丑 o(︶︿︶)o

链接: http://pan.baidu.com/s/1pL51yTd 密码: ee1e

项目