1. 程式人生 > >#android 利用fragment實現模仿微信的例項

#android 利用fragment實現模仿微信的例項

這裡寫圖片描述

圖片中給出了例項的效果,在點選下方的按鈕時,上半部分會自動切換成對應的內容。這裡使用的技術是fragment。

想必大家對fragment已經有所瞭解,就算不清楚,百度也有詳細的介紹。在這裡就著重介紹實現的過程。

首先,拿其中的一個部分“首頁”來講:
這裡寫圖片描述
上面一部分是fragment,下面則是相對固定的按鈕區。也就是說,當點選按鈕時,切換的只是上半部分內容。所以,每一個fragment都有一個自己的xml佈局檔案。就想圖中所示的,“首頁”這個fragment的xml檔案就是由一個textview構成。
完成fragment的xml檔案後,需要定義一個對應的java類來找到它,比如:首頁對應的類是homeFragment.java。注意,這個類需要繼承fragment,並且每一個這樣繼承fragment的類都需要重寫其onCreateView的方法。具體程式碼是:

import android.app.Fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.example.cerian.marcon.R;

/**
 * Created by Cerian on 2017/7/9.
 */

public class homeFragment extends
Fragment {
@Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view=inflater.inflate(R.layout.fragment_home, null); //找到按鈕前要加view. return view; } }

完成到這步時,每一個fragment的內容就已經完成了。接下來要做的是,將每一個fragment與一個頁面繫結並在其上顯示。這裡我用了一個menufunction.xml
這裡寫圖片描述

程式碼是:

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


    <LinearLayout
        android:id="@+id/ll_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

    </LinearLayout>


    <LinearLayout
       android:showDividers="beginning|end|middle"
        android:background="#ffffff"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">

        <ImageView
            android:id="@+id/ig_home"
            android:clickable="true"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:src="@mipmap/homepage1"/>

        <ImageView
            android:id="@+id/ig_lib"
            android:clickable="true"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:src="@mipmap/library1"/>

        <ImageView
            android:id="@+id/ig_my"
            android:clickable="true"
            android:layout_weight="1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:src="@mipmap/my1"/>


    </LinearLayout>

</RelativeLayout>

在這個佈局中,上面的LinearLayout是用來顯示fragment內容的,下面的是按鈕。

然後,在這個menufunction.xml的對應java類中,找到定義好的fragment,並顯示。主要的思想是:①拿到一個管理者②開啟一個事務③替換fragment內容④提交,注意,這裡的第四步很容易被遺忘。

程式碼是:

import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;

import com.example.cerian.marcon.fragment.homeFragment;
import com.example.cerian.marcon.fragment.libFragment;
import com.example.cerian.marcon.fragment.myFragment;

/**
 * Created by Cerian on 2017/7/9.
 */

public class home extends AppCompatActivity implements View.OnClickListener {

    private ImageView ig_home, ig_lib, ig_my;

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

        ig_home = (ImageView) findViewById(R.id.ig_home);
        ig_lib = (ImageView) findViewById(R.id.ig_lib);
        ig_my = (ImageView) findViewById(R.id.ig_my);

        ig_home.setOnClickListener(this);
        ig_lib.setOnClickListener(this);
        ig_my.setOnClickListener(this);

/**
 * 第一步:拿到管理者
 * 第二步:開啟事務
 * 第三步:替換
 * 第四步:提交
 */
        FragmentManager fragmentManager = getFragmentManager();
        FragmentTransaction beginTransaction = fragmentManager.beginTransaction();
        beginTransaction.replace(R.id.ll_layout, new homeFragment());
        ig_home.setImageResource(R.mipmap.homepage2);
        beginTransaction.commit();



    }

    @Override
    public void onClick(View view) {

        FragmentManager fragmentManager = getFragmentManager();
        FragmentTransaction beginTransaction = fragmentManager.beginTransaction();

        switch (view.getId()) {
            case R.id.ig_home:  //點選的是主頁

                beginTransaction.replace(R.id.ll_layout, new homeFragment());
                ig_home.setImageResource(R.mipmap.homepage2);
                ig_my.setImageResource(R.mipmap.my1);
                ig_lib.setImageResource(R.mipmap.library1);
                break;

            case R.id.ig_lib:  //點選的是收藏
                beginTransaction.replace(R.id.ll_layout, new libFragment());
                ig_home.setImageResource(R.mipmap.homepage1);
                ig_my.setImageResource(R.mipmap.my1);
                ig_lib.setImageResource(R.mipmap.library2);
                break;

            case R.id.ig_my:  //點選的是我的
                beginTransaction.replace(R.id.ll_layout, new myFragment());
                ig_home.setImageResource(R.mipmap.homepage1);
                ig_my.setImageResource(R.mipmap.my2);
                ig_lib.setImageResource(R.mipmap.library1);
                break;

        }
        beginTransaction.commit();

    }
}

其中,因為涉及到的點選事件有點多且相似,我用到了一個特殊的寫法,也就是setonclicklistener(this),引數用了this,並重新定義了一個click方法。注意:這樣寫,必須要繼承一個clicklistener的介面。
最後,提交就ok。
效果是:
這裡寫圖片描述

這就是利用fragment來模擬微信介面。
以上內容,如有不足之處,還望多多批評指正,謝謝。

相關推薦

#android 利用fragment實現模仿例項

圖片中給出了例項的效果,在點選下方的按鈕時,上半部分會自動切換成對應的內容。這裡使用的技術是fragment。 想必大家對fragment已經有所瞭解,就算不清楚,百度也有詳細的介紹。在這裡就著重介紹實現的過程。 首先,拿其中的一個部分“首頁”來

Android ViewPager和Fragment實現仿導航介面及滑動效果

1 先看看實現的效果: ps:上面每一幀Fragment中,包含是來自網路的圖片; 實現ViewPager+Fragment的頁面滑動和底部導航原理 主佈局檔案如下: <?xml version="1.0" encoding="utf-8"?> <L

Android Studio使用ViewPager+Fragment實現仿滑動切換介面

前言 微信的滑動切換獲得大家一致好評,在我們開發的過程中我們也經常模仿微信的導航效果。 首先看下效果圖 效果還算不錯,可以滑動切換和點選切換,微信介面用listview展示資料,通訊錄介面用的recyclerview展示資料,在接下來就帶著大家一一

ViewPager + Fragment 實現介面

在如今的網際網路時代,微信已是一個超級App。這篇通過ViewPager + Fragment實現一個類似於微信的介面,之前有用FragmentTabHost實現過類似介面,ViewPager的實現方式相對於FragmentTabHost的方式更簡單明瞭。 ViewPage

Android使用RecyclerView實現仿聯絡人列表

現在聯絡人列表基本都是按照字母或者拼音來進行分類,右邊有一排字母供使用者快速定位到指定的字母位置,效果圖如下: OK,輸入的聯絡人型別可能有很多種,比如漢字、英文、數字、特殊符號等等,其中漢字會轉化成拼音,完後和英文一起進行分類,分類的原則是首字母排序,而數字、特殊符號等

AndroidFragment實現介面互動小例項1

先看一下效果圖:         左右各是一個Fragment,左邊的三個按鈕可以控制右邊的背景色,右邊的mood按鈕,可以控制左邊最上面的ImageView,這樣就簡單的實現了Fragment的介面互動。         在MainActivity的佈局中新增Frag

Android模仿浮窗功能的效果實現

最近研究了微信懸浮窗的效果實現,寫此文章記錄一下,後面有我的GitHub原始碼地址。 老規矩,先放效果圖,效果如下所示: 首先,說下專案的主要幾個功能點。 1.app申請懸浮窗許可權,通過WindowManager新增檢視 2.一共新增三個檢視,右下角兩個

Android中Xposed框架篇-實現本地視頻發布到朋友圈功能

快速定位 adb 本地 ref jad jadx mps 頁面 視頻 微信非常龐大,還好有一些強大的工具,下面就來總結收獲的知識。 一、使用adb shell dumpsys activity top命令快速定位頁面 二、使用Jadx進行方法跟蹤時候如果發現沒有結

cocos creator android studio 實現遊戲登入功能(官方接入方式)

一:cocos creator端js呼叫java程式碼實現微信登入功能:JS部分  廢話不多說直接上程式碼: wechatLogin : function(){ jsb.reflection.callStaticMethod("org/cocos2dx/javascri

利用AccessibilityService自動獲取號(Android

perm 問題: 能夠 all 更多 原因 override 改變 第一個 前言: 最近遇到一個需求,要求寫一個小插件,能夠自動在微信的頁面彈出一個窗口,展示用戶的相關信息(與我們公司有關的信息,方便運營快速了解用戶信息)。 當時我第一反應是不可能,如果能夠在別的app中獲

Android-模仿小視窗(Dialog對話方塊風格的視窗)

運用方法: 將顯示視窗的風格 設定為對話方塊風格即可 具體效果: 具體實現: 首先我們先定義佈局檔案: <?xml version="1.0" encoding="utf-8" ?> <RelativeLayout xmlns:android="h

使用Android輔助服務AccessibilityService實現自動搶紅包的小程式

WeiXinAssistant 微信助手,是一個使用Android輔助服務實現的微信自動搶紅包的小程式; 說明 通過利用AccessibilityService輔助服務,監測螢幕內容,如監聽狀態列的資訊,螢幕跳轉等,以此來實現自動拆紅包的功能。 邏輯 第一種方式:

android 融雲 + 科大訊飛 實現仿語音訊息轉換為文字(附DEMO原始碼)

融雲SDK 使用很方便,簡單配置就可以搭建即時通訊功能,配合科大訊飛的語音識別, 即可實現微信中語音訊息轉換為文字的功能 融雲sdk的基本使用就不細說了, 網上很多資料 使用融雲sdk自帶的聊天會話介面,想要在此會話介面上增加語音訊息長按時彈出 “轉換為文

Android中Xposed框架篇-實現本地視訊釋出到朋友圈功能

本文轉載自微信實現本地視訊釋出到朋友圈功能 前一篇文章已經詳細介紹瞭如何使用Xposed框架編寫搖色子和剪刀石頭布作弊器,本文繼續介紹如何使用Xposed框架編寫微信外掛將本地小視訊釋出到朋友圈,這裡還是使用微信6.3.9版本進行操作。 微信6.3.9.ap

Android高仿qq及底部選單的幾種實現方式

最近專案沒那麼忙,想著開發app的話,有很多都是重複,既然是重複的,那就沒有必要每次都去寫,所以就想著寫一個app通用的基本框架,這裡說的框架不是什麼MVC,MVP,MVVM這種,而是app開發的通用模式,一般的app都是底部有幾個選單按鈕,類似qq這樣的,只不

Android移動開發-在Android專案裡整合呼叫支付開發的實現

如今移動支付比較火,尤其是在中國的市場。移動支付也稱為手機支付,就是允許使用者使用其移動終端(通常是手機)對所消費的商品或服務進行賬務支付的一種服務方式。單位或個人通過移動裝置、網際網路或者近距離感測直接或間接向銀行金融機構傳送支付指令產生貨幣支付與資金轉

Android自定義ListView實現仿側滑刪除

經常在遇到問題第一時間都會在網上搜索解決的方法,因此看到很多前輩們的比較精闢的技術文章,學習了很多東西,現在將自己平時工作中開發的一些小功能坐下總結,也寫出來,既方便自己理清思路記憶功能塊實現思路,又能與大家一起交流分享技術。 第一次寫文章,哪裡有不對的希望大

模仿 長按錄音 功能 實現

說明 最近參考別人程式碼自己模仿著寫了一個微信長按錄音的功能 效果圖 本來錄完的時候那個“我是時間”應該會變為具體的時間的,但是不知道我的360奇酷手機出了什麼毛病,一直不會改變,以及那個試聽的語音框其實可以根據時間長短改變長度的,但

Android簡單實現仿選擇圖片以及拍照(PhotoPicker)

實現仿微信的圖片選擇,預覽以及拍照,屬性可以設定顯示照相機以及預覽時是否顯示刪除按鈕等,功能齊全並且可以根據儲存照片的路徑進行修改等 Gradle配置 dependencies { co

Android實現仿朋友圈釋出動態(拍照、相簿選擇、照片壓縮、顯示、儲存、縮圖、點選縮圖刪除對應檔案等)附原始碼

         原創作品,轉載請註明出處:http://blog.csdn.net/zhang3776813/article/details/52092591 最近專案需求中要用到類似微信朋友圈釋出動態選擇圖片的UI效果,研究了一下,特來分享成果,多的不說來看程式碼。