首页 > 代码库 > android 安卓 微信布局

android 安卓 微信布局

微信布局    

直接上代码吧


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

项目 /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>
head.xml

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

技术分享带@什么什么的大多都有配  技术分享  (良心配方 ?   ( ̄△ ̄;)   )

不急 不急   先来一个一个解决吧   ( ̄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>
strings.xml

 

 

 项目 下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>
styles.xml

 项目下 /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>
text_color.xml

 

那啥  技术分享和 技术分享 这玩意还有技术分享 是吧

 技术分享技术分享技术分享

技术分享技术分享技术分享技术分享技术分享技术分享技术分享技术分享技术分享

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

如:技术分享

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

 

会用 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>
bottom.xml

 项目下/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>
tab_weixin.xml

 项目下/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>
tab_set.xml

项目下/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>
tab_sddre.xml

项目下/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>
tab_find.xml

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

技术分享

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

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

 项目下/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>
weixin.xml

这就就好了? ???

技术分享

 

到这    算是好了吧  

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

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

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

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

 

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

 技术分享

 

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

 

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

项目

 

android 安卓 微信布局