首页 > 其他 > 详细

support Fragment 与滑动导航的组合

时间:2014-03-25 08:41:29      阅读:435      评论:0      收藏:0      [点我收藏+]

在做一个项目,有导航功能,但是不能滑动。调试了一天,用过ViewPager + PagerTabStrip,可惜做出来的效果文字是动态的,有点急躁不想去找调试的方法了。

 

换成FrameLayout + Fragment展示内容,用<RelativeLayout> 来做导航布局。

 

main_activity.xml 

bubuko.com,布布扣
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
  <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/head_bar"
        android:background="#FFF8DC"
        >
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:src="@drawable/ic_menu_back"
            android:layout_alignParentLeft="true"
            />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="火灾损失统计"
            android:layout_centerInParent="true"
            />
    </RelativeLayout>
    
    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/navegation"
        android:layout_below="@id/head_bar"
        android:background="#DCDCDC"
        >
        <LinearLayout
            android:layout_width="fill_parent" 
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:id="@+id/menu_bar_row"
            >
            
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical" 
                android:layout_weight="1"
                android:gravity="center_horizontal"
                >
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_menu_today"
                    android:clickable="true"
                    android:id="@+id/tab_head"
                    />
                <TextView
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    android:gravity="center_vertical|center_horizontal"
                    android:text="表头"
                    />
            </LinearLayout>
            
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical" 
                android:layout_weight="1"
                android:gravity="center_horizontal"
                >
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                     android:src="@drawable/ic_menu_compass"
                     android:clickable="true"
                     android:id="@+id/tab_body"
                    />
                <TextView
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    android:text="主体"
                    />
            </LinearLayout>
            
            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical" 
                android:layout_weight="1"
                android:gravity="center_horizontal"
                >
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                     android:src="@drawable/ic_menu_copy"
                     android:clickable="true"
                     android:id="@+id/tab_print"
                    />
                <TextView
                    android:layout_height="wrap_content"
                    android:layout_width="wrap_content"
                    android:text="打印"
                    />
            </LinearLayout>
            
        </LinearLayout>
        
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:layout_below="@id/menu_bar_row"
            android:paddingBottom="3dp"
            android:layout_gravity="bottom"
            >
            <ImageView
                android:layout_width="50dp"
                android:layout_height="2dp"
                android:layout_marginLeft="28dp"
                android:id="@+id/img_indicateLine" 
                android:src="#fff"
                
                android:gravity="center_horizontal"
                />
        </LinearLayout>
    </RelativeLayout>
    
    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/navegation"
        >
        <FrameLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/fragmentContainer"
            >      
        </FrameLayout>    
        
    </RelativeLayout>

</RelativeLayout>
main_activity

Main_Activity

bubuko.com,布布扣
package com.wfb.testfireloss;

import android.graphics.BitmapFactory;
import android.graphics.Matrix;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;

import com.wfb.bean.TabHead;
import com.wfb.fragments.TabBodyFragment;
import com.wfb.fragments.TabHeadFragment;
import com.wfb.fragments.TabPrintFragment;

public class MainActivity extends FragmentActivity {
    private static final String TAG = "MainActivity";
    
    private TabHead tabHead = null;  //保存表头信息的类
    
    private final FragmentManager fragmentManager = getSupportFragmentManager();
    private TabHeadFragment tabHeadFragment = null;
    private TabBodyFragment tabBodyFragment = null;
    private TabPrintFragment tabPrintFragment = null;
    
    private ImageView img_tabHead = null;
    private ImageView img_tabBody = null;
    private ImageView img_tabPrint = null;
    private ImageView img_bottomLine = null;
    
    private int currIndex = 0;
    private int bottomLineWidth;
    private int offset = 0;
    private int position_one;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);    
        
        img_tabHead = (ImageView)findViewById(R.id.tab_head);
        img_tabBody = (ImageView)findViewById(R.id.tab_body);
        img_tabPrint = (ImageView)findViewById(R.id.tab_print);
        
        img_tabHead.setOnClickListener(new MenuClickListener(0));
        img_tabBody.setOnClickListener(new MenuClickListener(1));
        img_tabPrint.setOnClickListener(new MenuClickListener(2));
        
        tabHeadFragment = new TabHeadFragment();
        FragmentTransaction transaction = fragmentManager.beginTransaction();
        transaction.add(R.id.fragmentContainer, tabHeadFragment);
        transaction.commit();
        
        img_bottomLine = (ImageView)findViewById(R.id.img_indicateLine);
        bottomLineWidth = img_bottomLine.getLayoutParams().width;
        Log.i(TAG, "cursor imageview width=" + bottomLineWidth);
                
        DisplayMetrics dm = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(dm);
        
        int screenW = dm.widthPixels;
        Log.i("MainActivity", "screenW=" + screenW);
        
        offset = (int)((screenW/3.0 - bottomLineWidth) / 2.0);
        Log.i("MainActivity", "offset=" + offset);
        
        position_one = (int)(screenW / 3.0);
        
        Matrix matrix = new Matrix();  
        matrix.postTranslate(offset, 0);  
        img_bottomLine.setImageMatrix(matrix);// 设置动画初始位置  

        
    }
    
    class MenuClickListener implements View.OnClickListener{
        private int index = 0;
        
        public MenuClickListener(int index){
            this.index = index;
        }
        
        public void onClick(View v){
            switch(index){
            case 0:
                if(tabHeadFragment == null){
                    tabHeadFragment = new TabHeadFragment();
                }
                FragmentTransaction transaction = fragmentManager.beginTransaction();
                transaction.replace(R.id.fragmentContainer, tabHeadFragment);
                transaction.commit();
                
                updateBottomLine(0);
                break;
            case 1:
                if(tabBodyFragment == null){
                    tabBodyFragment = new TabBodyFragment();
                }
                FragmentTransaction transaction2 = fragmentManager.beginTransaction();
                transaction2.replace(R.id.fragmentContainer, tabBodyFragment);
                transaction2.commit();
                
                updateBottomLine(1);
                break;
            case 2:
                if(tabPrintFragment == null){
                    tabPrintFragment = new TabPrintFragment();
                }
                FragmentTransaction transaction3 = fragmentManager.beginTransaction();
                transaction3.replace(R.id.fragmentContainer, tabPrintFragment);
                transaction3.commit();
                
                updateBottomLine(2);
                break;
            }
        }
        
        private void updateBottomLine(int clickedIndex){    
            //Log.i(TAG,"source: " + (position_one*currIndex) + " des: " + (position_one*clickedIndex) );
            Animation animation = new TranslateAnimation(position_one*currIndex, position_one*clickedIndex, 0, 0);  
            currIndex = clickedIndex;  
            animation.setFillAfter(true);// True:图片停在动画结束位置  
            animation.setDuration(300);  
            img_bottomLine.startAnimation(animation);  

        }
    }


    public TabHead getTabHeadInstance(){
        if(this.tabHead == null)
            return (new TabHead());        
        return tabHead;        
    }
    
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

}
MainActivity

定义Fragment ,像下面这样

bubuko.com,布布扣
package com.wfb.fragments;

import com.wfb.testfireloss.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 TabBodyFragment extends Fragment{

    private View tab_body_layout = null;
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        tab_body_layout = inflater.inflate(R.layout.tab_body_layout, container,false);
        return tab_body_layout;
    }

    @Override
    public void onPause() {
        // TODO Auto-generated method stub
        super.onPause();
    }
    
}
TabBodyFragment

今天这个调试感谢http://blog.csdn.net/wangjinyu501/article/details/8169924,其中的亮点是动画的新算法。

support Fragment 与滑动导航的组合,布布扣,bubuko.com

support Fragment 与滑动导航的组合

原文:http://www.cnblogs.com/wfb-tsy/p/3622151.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!