Android之fragment点击切换和滑动切换结合

学了一小段时间的Android,主要接触的是UI设计，打交道最多莫过于fragment了吧。在Android3.0引入了fragment的概念后，几乎在所以的Android的应用中都可以看见其身影，已经有很多前辈高人都已经详细介绍过fragmrnt，我这里就不多说什么了。

这里本来是想模仿一下微信的切换效果，怎奈水平不足，这里就献丑贴出半成品的代码，希望有大神能指点一下。废话不多说，上代码。先从简单的开始吧，这里是我一共用了3个fragment，这里就只贴出第一个的fragment的布局，别的两个基本一样,比较简朴。

<?xml version="1.0" encoding="UTF-8"?>

<LinearLayout

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical"

    android:gravity="center_horizontal|center_vertical"

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

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="This the first fragment"

        />

</LinearLayout>

接下来的是使用fragment片段，这里也只贴出第一个的。

package com.example.fragments;

import com.example.viewfragtext.R;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

public class Fragmentone extends Fragment

{

    @Override

    public View onCreateView(LayoutInflater inflater, ViewGroup container,

            Bundle savedInstanceState) {

        // TODO Auto-generated method stub

        return inflater.inflate(R.layout.fragment1, container, false);

    }

}

接下来便要开始实现切换的功能，这里是底部切换组件(tabfoot)的布局。

<?xml version="1.0" encoding="UTF-8"?>

<LinearLayout

    android:layout_width="fill_parent"

    android:layout_height="44dp"

    android:orientation="horizontal"

    android:background="@drawable/tabfootbg"

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

    <LinearLayout

         android:id="@+id/lay1"

         android:layout_width="match_parent"

         android:layout_height="match_parent"

         android:layout_weight="1"

         style="@style/Linearlayout_Style"

        >

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:id="@+id/fratext1"

            android:text="@string/chat"

            android:textColor="@color/black"

            />

    </LinearLayout>

    <LinearLayout

         android:id="@+id/lay2"

         android:layout_width="match_parent"

         android:layout_height="match_parent"

         android:layout_weight="1"

         style="@style/Linearlayout_Style">

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:id="@+id/fratext2"

            android:text="@string/find"

            android:textColor="@color/black"/>

    </LinearLayout>

    <LinearLayout

         android:id="@+id/lay3"

         android:layout_width="match_parent"

         android:layout_height="match_parent"

         android:layout_weight="1"

         style="@style/Linearlayout_Style">

         <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:id="@+id/fratext3"

            android:text="@string/tongxunlu"

            android:textColor="@color/black"/>

     </LinearLayout>

</LinearLayout>

这里分别是自定义的style和color的代码。

<style name="Linearlayout_Style">

        <item name="android:orientation">vertical</item>

        <item name="android:gravity">center</item>

        <item name="android:clickable">true</item>

        <item name="android:onClick">LayoutOnclick</item>

 </style>

<?xml version="1.0" encoding="UTF-8"?>

<resources >

    <color name="lightseagreen">#20b2aa</color><!--亮海蓝色 -->

    <color name="black">#000000</color><!-- 黑色 -->

</resources>

别的设计都完成了，马上对应的是MainActivity的设计，这是其布局

<LinearLayout

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical"

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

    <fragment

        android:name="com.example.fragments.Fragmentone"

        android:id="@+id/fragment1"

        android:layout_height="0dp"

        android:layout_weight="1.0"

        android:layout_width="fill_parent"

        />

     <fragment

        android:name="com.example.fragments.Fragmenttwo"

        android:id="@+id/fragment2"

        android:layout_height="0dp"

        android:layout_weight="1.0"

        android:layout_width="fill_parent"

        />

         <fragment

        android:name="com.example.fragments.Fragmentthree"

        android:id="@+id/fragment3"

        android:layout_height="0dp"

        android:layout_weight="1.0"

        android:layout_width="fill_parent"

        />

    <include layout="@layout/tabfoot"/>

</LinearLayout>

最后遍是实现在主活动中实现点击底部切换和滑动的换的功能。这里滑动功能我是采用手势（Gesture）实现的。

 package com.example.viewfragtext;

 import android.os.Bundle;

 import android.support.v4.app.Fragment;

 import android.support.v4.app.FragmentActivity;

 import android.view.GestureDetector;

 import android.view.GestureDetector.OnGestureListener;

 import android.view.Menu;

 import android.view.MotionEvent;

 import android.view.View;

 import android.widget.LinearLayout;

 import android.widget.TextView;

 public class MainActivity extends FragmentActivity implements OnGestureListener

 {

     public static Fragment[] fragments;

     public static LinearLayout[] linearLayouts;

     public static TextView[] textViews;

     /**定义手势检测实例*/

     public static GestureDetector detector;

     /**做标签，记录当前是哪个fragment*/

     public int MARK=0;

     /**定义手势两点之间的最小距离*/

     final int DISTANT=50; 

     @Override

     protected void onCreate(Bundle savedInstanceState) {

         super.onCreate(savedInstanceState);

         setContentView(R.layout.activity_main);

         //分别实例化和初始化fragement、lineatlayout、textview

         setfragment();

         setlinearLayouts();

         settextview();

         //创建手势检测器

         detector=new GestureDetector(this);

     }

     @Override

     public boolean onCreateOptionsMenu(Menu menu) {

         // Inflate the menu; this adds items to the action bar if it is present.

         getMenuInflater().inflate(R.menu.main, menu);

         return true;

     }

     /**初始化fragment*/

     public void setfragment()

     {

         fragments=new Fragment[3];

         fragments[0]=getSupportFragmentManager().findFragmentById(R.id.fragment1);

         fragments[1]=getSupportFragmentManager().findFragmentById(R.id.fragment2);

         fragments[2]=getSupportFragmentManager().findFragmentById(R.id.fragment3);

         getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

         .show(fragments[0]).commit();

     }

      /**初始化linerlayout*/

     public void setlinearLayouts()

     {

         linearLayouts=new LinearLayout[3];

         linearLayouts[0]=(LinearLayout)findViewById(R.id.lay1);

         linearLayouts[1]=(LinearLayout)findViewById(R.id.lay2);

         linearLayouts[2]=(LinearLayout)findViewById(R.id.lay3);

         linearLayouts[0].setBackgroundResource(R.drawable.lay_select_bg);

     }

      /**初始化textview*/

     public void settextview()

     {

         textViews=new TextView[3];

         textViews[0]=(TextView)findViewById(R.id.fratext1);

         textViews[1]=(TextView)findViewById(R.id.fratext2);

         textViews[2]=(TextView)findViewById(R.id.fratext3);

         textViews[0].setTextColor(getResources().getColor(R.color.lightseagreen));

     }

     /**点击底部linerlayout实现切换fragment的效果*/

     public void LayoutOnclick(View v)

     {

         resetlaybg();//每次点击都重置linearLayouts的背景、textViews字体颜色

         switch (v.getId()) {

         case R.id.lay1:

              getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

                 .show(fragments[0]).commit();

             linearLayouts[0].setBackgroundResource(R.drawable.lay_select_bg);

             textViews[0].setTextColor(getResources().getColor(R.color.lightseagreen));

             MARK=0;

             break;

         case R.id.lay2:

             getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

             .show(fragments[1]).commit();

             linearLayouts[1].setBackgroundResource(R.drawable.lay_select_bg);

             textViews[1].setTextColor(getResources().getColor(R.color.lightseagreen));

             MARK=1;

             break;

         case R.id.lay3:

             getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

             .show(fragments[2]).commit();

             linearLayouts[2].setBackgroundResource(R.drawable.lay_select_bg);

             textViews[2].setTextColor(getResources().getColor(R.color.lightseagreen));

             MARK=2;

         break;

         default:

             break;

         }

     }

     /**重置linearLayouts、textViews*/

     public void resetlaybg()

     {

         for(int i=0;i<3;i++)

         {

             linearLayouts[i].setBackgroundResource(R.drawable.tabfootbg);

             textViews[i].setTextColor(getResources().getColor(R.color.black));

         }

     }

     @Override

     public boolean onTouchEvent(MotionEvent event) {

         // TODO Auto-generated method stub

         //将该Activity上触碰事件交给GestureDetector处理

         return detector.onTouchEvent(event);

     }

     @Override

     public boolean onDown(MotionEvent arg0) {

         // TODO Auto-generated method stub

         return false;

     }

     /**滑动切换效果的实现*/

     @Override

     public boolean onFling(MotionEvent arg0, MotionEvent arg1, float arg2,

             float arg3) {

         // TODO Auto-generated method stub

         resetlaybg();

         //当是Fragment0的时候

         if(MARK==0)

         {

             if(arg1.getX()>arg0.getX()+DISTANT)

             {

                 getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

                 .show(fragments[1]).commit();

                 linearLayouts[1].setBackgroundResource(R.drawable.lay_select_bg);

                 textViews[1].setTextColor(getResources().getColor(R.color.lightseagreen));

                 MARK=1;

             }

             else

             {

                 linearLayouts[0].setBackgroundResource(R.drawable.lay_select_bg);

                 textViews[0].setTextColor(getResources().getColor(R.color.black));

             }

         }

         //当是Fragment1的时候

         else if (MARK==1)

         {

             if(arg1.getX()>arg0.getX()+DISTANT)

             {

                 getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

                 .show(fragments[2]).commit();

                 linearLayouts[2].setBackgroundResource(R.drawable.lay_select_bg);

                 textViews[2].setTextColor(getResources().getColor(R.color.lightseagreen));

                 MARK=2;

             }

             else if(arg0.getX()>arg1.getX()+DISTANT)

             {

                 getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

                 .show(fragments[0]).commit();

                 linearLayouts[0].setBackgroundResource(R.drawable.lay_select_bg);

                 textViews[0].setTextColor(getResources().getColor(R.color.lightseagreen));

                 MARK=0;

             }

             else

             {

               linearLayouts[1].setBackgroundResource(R.drawable.lay_select_bg);

                 textViews[1].setTextColor(getResources().getColor(R.color.black));

             }

         }

         //当是Fragment2的时候

         else if(MARK==2)

         {

             if(arg0.getX()>arg1.getX()+DISTANT)

             {

              getSupportFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[2])

              .show(fragments[1]).commit();

              linearLayouts[1].setBackgroundResource(R.drawable.lay_select_bg);

                 textViews[1].setTextColor(getResources().getColor(R.color.lightseagreen));

              MARK=1;

             }

             else

             {

              linearLayouts[2].setBackgroundResource(R.drawable.lay_select_bg);

                 textViews[2].setTextColor(getResources().getColor(R.color.black));

             }

         }

         return false;

     }

     @Override

     public void onLongPress(MotionEvent arg0) {

         // TODO Auto-generated method stub

     }

     @Override

     public boolean onScroll(MotionEvent arg0, MotionEvent arg1, float arg2,

             float arg3) {

         // TODO Auto-generated method stub

         return false;

     }

     @Override

     public void onShowPress(MotionEvent arg0) {

         // TODO Auto-generated method stub

     }

     @Override

     public boolean onSingleTapUp(MotionEvent arg0) {

         // TODO Auto-generated method stub

         return false;

     }

 }

最后的效果图

Android之fragment点击切换和滑动切换结合

转载请注明出处：http://www.cnblogs.com/zhrxidian/p/3801545.html

Android之fragment点击切换和滑动切换结合的更多相关文章

Android典型界面设计——ViewPage+Fragment实现区域顶部tab滑动切换
一.问题描写叙述本系列将结合案例应用,陆续向大家介绍一些Android典型界面的设计,首先说说tab导航,导航分为一层和两层(底部区块+区域内头部导航).主要实现方案有RadioGroup+View ...
Android 使用TabLayout、ViewPager和Fragment实现顶部菜单可滑动切换
效果图如下首先,要使用控件需要添加design library,在Android Studio中添加 compile 'com.android.support:design:23.4.0' 然后是布 ...
Android Studio之多个Activity的滑动切换（二）
1.因为Android界面上的全部控件一般都位于Layout控件(比方RelativeLayout)之上,而布局控件能够设置响应touch事件,所以能够通过布局控件的setOnTouchListen来 ...
Android防微信首页左右滑动切换
大家看到微信首页切换效果有没有觉得很炫,滑动切换,点击底部bar瞬间切换,滑动切换渐变效果,线上效果图: 之前也在博客上看到别人的实现,再次基础上,我做了些优化.首先说下实现原理,大神略过,o(╯□╰ ...
[Android] 使用Include布局+Fragment滑动切换屏幕
前面的文章已经讲述了"随手拍"项目图像处理的技术部分,该篇文章主要是主界面的布局及屏幕滑动切换,并结合鸿洋大神的视频和郭神的第一行代码(强推两人Android博客),完毕了 ...
Fragment+ViewPager实现仿微信点击和滑动切换界面
这是在我写的新闻App中实现的界面切换贴出切换界面的主要代码: xml代码: <span style="font-size:14px;"> <android.s ...
Android自定义顶部栏及侧滑菜单和fragment+viewpag滑动切换的实现
嘿嘿嘿,关于android滑动的操作,是不是经常都会用到呢. 我肯定也要学习一下啦. https://blog.csdn.net/u013184970/article/details/82882107 ...
Android开发之ViewPager+ActionBar+Fragment实现响应式可滑动Tab
今天我们要实现的这个效果呢,在Android的应用中十分地常见,我们可以看到下面两张图,无论是系统内置的联系人应用,还是AnyView的阅读器应用,我们总能找到这样的影子,当我们滑动屏幕时,Tab可 ...
Android使用Fragment来实现ViewPager的功能（解决切换Fragment状态不保存）以及各个Fragment之间的通信
以下内容为原创,转载请注明:http://www.cnblogs.com/tiantianbyconan/p/3364728.html 我前两天写过一篇博客<Android使用Fragment来 ...

随机推荐

peer not authenticated的终极解决方案
一.前述使用httpclient发起https请求时,可能会遇到如下异常: javax.net.ssl.SSLPeerUnverifiedException: peer not authentica ...
深入学习jQuery动画队列
前面的话队列实现是jQuery非常棒的一个拓展,使用动画队列可以使动画更容易实现.本文将详细介绍jQuery动画队列 queue() queue()方法用来显示在匹配的元素上的已经执行的函数队列 q ...
Thread1&colon;EXC&lowbar;BAD&lowbar;ACCESS 错误
描述:野指针,在对象被释放之后又调用了该对象场景:在某个UIVIewController释放之后有调用了该Controller的某些方法. 由于项目需求需要监控WebView的滚动,所以在控制器中给 ...
JS与Jquery学习笔记（二）
一. JS 的面向对象 JS没有类,其类就用function来代替如下所示: function Cat(name, color){ this.name=name; this.color=color; ...
Icon Font的转换
Icon Font是用于网页的纯色图标,这里引用一张网络图片: 由于体积小,易维护等特点,IconFont应用非常广泛. 这里推荐一个转换器,通过Upload一个后缀ttf的字体文件,可以反解出文件下 ...
WPF ListView 排序
代码如下: list为ListView组件.Score为要排序的列,也是绑定的属性. CollectionViewSource.GetDefaultView(list.ItemsSource).Sor ...
repo的用法
转自:http://blog.csdn.net/junglyfine/article/details/6299636 注:repo只是google用Python脚本写的调用Git的一个脚本,主要是用来 ...
Paging
COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION Both unequal fixed-si ...
js实现url链接encode加密
function urlencode(clearString) { var output = ''; var x = 0; clearString = utf16to8(clearString.toS ...
eclipse环境下基于tomcat-7&period;0&period;82构建struts2项目
开山第一篇,毕业4个月目前接触最多的框架还是s2sh框架.... 具备完整的开发环境下,在eclipse下启动tomcat出现如下所示画面表示环境构建成功. 第一步:创建web项目,截图如下此页面只 ...