android -智慧北京


主頁面作出slidingmenu效果

1,引入相應libraryjava

eclipse:直接import到項目中,與導入項目相似。用須要的項目綁定:properrise->android->addandroid

http://www.csdn.net/article/2013-05-03/2815127-Android-open-source-projectsgit

或者在github上直接找github

2.Mainactivity繼承slidingfragmenactivityweb

 

public class MainActivity extends SlidingFragmentActivity {
	
	private String FRAGMENT_LEFT_MENU="fragment_left_menu";
	private String FRAGMENT_CONTENT="fragment_content";


	@Override
	public void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		setBehindContentView(R.layout.left_menu); //加載左側邊欄
		
		SlidingMenu slidingMenu=getSlidingMenu();
		slidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
		slidingMenu.setBehindOffset(200);
		
		initFragment();
		
	}

 

3.library和項目中support-v4包衝突:apache

 

把項目中的support-v4包刪除以後,再在build path 裏面把相應library刪除json

 


用fragment搭建主頁

1.將須要放fragment的佈局內容改爲fragmentlayout,並加上一個id數組

   activity_main.xml瀏覽器

 

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/fl_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.smart_china.MainActivity" >



</FrameLayout>

 

 

 

爲何使用fragment:讓Activity裏面的 佈局聯繫功能更模塊化服務器

 

2.在mainActivity.java裏面初始化須要顯示的fragment

 

public void initFragment() {
		// TODO Auto-generated method stub
		FragmentManager  fManager=getSupportFragmentManager();
		FragmentTransaction transaction=fManager.beginTransaction();
			

		transaction.replace(R.id.fl_content,new ContentFragment(), FRAGMENT_CONTENT);
		transaction.replace(R.id.fl_left_menu,new  LeftMenuFragment(), FRAGMENT_LEFT_MENU);
		
		transaction.commit();
		
		fManager.findFragmentByTag(FRAGMENT_LEFT_MENU);

		
	}

 

 

 

3.一個繼承fragment類的基類:BaseFragment

public abstract class BaseFragment extends Fragment {
	
	public Activity   myactivity;

	
	//構建Fragment
	@Override
	public void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		myactivity=getActivity();
	}

	
	@Override
	public void onActivityCreated(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onActivityCreated(savedInstanceState);
		
		initData();
	}
	
	
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		return initView();
	}


	public abstract View initView();


	public  void initData() {
		// TODO Auto-generated method stub
		
	}
	
	

	

	

}

 

 

 

4.繼承BaseFragment的側邊欄

 

 

public class ContentFragment extends BaseFragment {

	public View initView() {
		// TODO Auto-generated method stub
		View view =View.inflate(myactivity, R.layout.fragment_content, null);
		
		return view;
	}



}

 

 


主頁用ViewPage和radiobutton實現(fragment_content)

 

1.viewpager

 

<android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        
        /

 

2.radiogroup

 

<RadioGroup
        android:id="@+id/rg_group"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bottom_tab_bg"
        android:orientation="horizontal" >


        <RadioButton
            style="@style/ButtonTabStyle"
            android:drawableTop="@drawable/btn_tab_news_selector"

 

3.style樣式複用(style.xml佈局)

 

<style  name="ButtonTabStyle">
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:button">@null</item>   //設置button上的圖片樣式消失
        <item name="android:layout_gravity">center_vertical</item>     //控件自己相對於父控件的顯示位置
        <item  name="android:padding">5dp</item>
        <item  name="android:drawablePadding">5dp</item>  //圖文間距
        <item  name="android:layout_weight">1</item>    
         <item  name="android:gravity">center</item>  //設置的是控件自身上面的內容位置
    </style>

 

4.按鈕圖片選擇器(drawable下新建xml文件)

 

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <item android:state_checked="true"        //選擇後的狀態一直保持
     android:drawable="@drawable/home_press"/>
    <item android:drawable="@drawable/home"/>
    
   
</selector>

 

 



主頁下5個子頁面的實現(實現按鈕對應功能)

 

   實現這種幾個有共同特徵的頁面切換,能夠先寫一個BasePager的父類,這個類有一個公共綁定view試圖(view試圖內部改動大的地方用fragmentlayout佈局)。子類繼承父類以後再在父類基礎上作修改.

   一、基類BasePager.java

public class BasePager {
	
	public Activity mActivity;
	public View mRootView;
	public  TextView  tvTitle;    //從公共佈局中獲取的須要在子類佈局中作改動的控件
       public FrameLayout  flContent;
	
	public  BasePager (Activity activity){
		mActivity=activity;
		initViews();
	}
	
	public  void initViews(){
		mRootView=View.inflate(mActivity,R.layout.base_pager, null);
		tvTitle=(TextView) mRootView.findViewById(R.id.tv_title);
		flContent=(FrameLayout) mRootView.findViewById(R.id.fl_content);
		
	}
	
	
	public  void initData(){
		
	}
	
	

}

  二、基類綁定的view視圖(base_pager.xml)

 

 

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

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:background="@drawable/title_red_bg"
        >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:layout_marginLeft="24dp"
            android:src="@drawable/img_menu" />

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/imageView1"
            android:layout_marginLeft="60dp"
            android:layout_toRightOf="@+id/imageView1"
            android:textColor="#fff"
            android:text="智慧北京" />

    </RelativeLayout>

    <FrameLayout
        android:id="@+id/fl_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
        
        
    </FrameLayout>

</LinearLayout>

 

 

 

   三、子類之一( HomePager.java)

 

public class HomePager extends BasePager {

	public HomePager(Activity activity) {
		super(activity);
		initData();        
		// TODO Auto-generated constructor stub
	}
	
	
	@Override
	public void initData() {
		// TODO Auto-generated method stub
		
		
		tvTitle.setText("首頁");
		TextView textView=new TextView(mActivity);
		textView.setText("我是首頁,hahaha!");
		
		//向frameLayout裏動態添加布局
		flContent.addView(textView);   

		
	}

}

 

4.主函數中加載ViewPager(這裏是ContentFragment.java)

容器ViewPager

裝子視圖BasePager的數組,將子類Pager填

重寫PagerAdapter適配器:

instantiateItem

該方法是加載當前頁面的試圖,須要將該Pager類的View對象填充入container容器內

 

destroyItem

該方法用於銷燬當前view對象。

 

public class ContentFragment extends BaseFragment {
	
	@ViewInject(R.id.rg_group)
	private RadioGroup rgGroup;
	
	@ViewInject(R.id.vp_content)
	private ViewPager mViewPager;    //容器ViewPager
	private ArrayList<BasePager> mPagerList;  //裝子視圖BasePager的數組

	public View initView() {
		// TODO Auto-generated method stub
		View view =View.inflate(myactivity, R.layout.fragment_content, null);
		 ViewUtils.inject(this, view); //注入view和事件
		
		return view;
	}

	
	@Override
	public void initData() {
		// TODO Auto-generated method stub
		rgGroup.check(R.id.rb_home);  //默認勾選首頁
		
		
		mPagerList=new ArrayList<BasePager>();
	/*	for(int i=0;i<5;i++){
			BasePager pager=new BasePager(myactivity);
			mPagerList.add(pager);
			
		}
		*/
		
		//將子類Pager裝入父類數組BasePagr中

               mPagerList.add(new HomePager(myactivity));
		mPagerList.add(new NewsCenterPager(myactivity));
		mPagerList.add(new SmartServicePager(myactivity));
		mPagerList.add(new GovAffiarsPager(myactivity));
		mPagerList.add(new SettingPager(myactivity));
		
	
		mViewPager.setAdapter(new ContentAdapter());  
         
		
		
		
	}
	
	
	//適配器就是一系列對象集合的封裝
	class  ContentAdapter extends PagerAdapter{

		@Override
		public int getCount() {
			// TODO Auto-generated method stub
			return mPagerList.size();
		}

		@Override
		public boolean isViewFromObject(View arg0, Object arg1) {
			// TODO Auto-generated method stub
			return arg0==arg1 ;
		}
		
		
		
		 // viewgroup是裝視圖的容器
		@Override
		public Object instantiateItem(ViewGroup container, int position) {
			// TODO Auto-generated method stub
			BasePager pager=mPagerList.get(position);
		
			container.addView(pager.mRootView);
	/*		pager.initData();*/
			
			return pager.mRootView;
		}
		
		
		@Override
		public void destroyItem(View container, int position, Object object) {
			// TODO Auto-generated method stub
			((ViewPager) container).removeView((View) object);
		}
		
		
	}


}

 


取消PagerView滑動切換&&sliding視點擊頁面狀況出現

      用viewpager來實現子頁面,它會自動實現頁面的左右切換,有時候不須要這樣的滑動切換效果。須要直接點擊radiobutton來實現切換。

   1. 從新定義一個viewpager的view類,該類不支持Ontouchevent事件,直接在xml中引用

    NoScrollViewPager.java

public class NoScrollViewPager extends ViewPager {


public NoScrollViewPager(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}

	public NoScrollViewPager(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
	}
	
	

	@Override
	public boolean onTouchEvent(MotionEvent arg0) {
		// TODO Auto-generated method stub
		return false;
	}

}

  而後右鍵類名-》Copy Qualified name->複製完整路徑到xml文件的viewpager中

 

 

    fragment_content.xml(引用重寫的viewpager)

 

<View.NoScrollViewPager
         android:id="@+id/vp_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"  
        
        />

 

 

 

2.radiobutton按鈕切換頁籤

 

//頁籤切換
		rgGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {
			@Override
			public void onCheckedChanged(RadioGroup group, int checkedId) {
				// TODO Auto-generated method stub
				
				switch (checkedId) {
				case R.id.rb_home:
					mViewPager.setCurrentItem(0,false);  //加入false是去掉頁面切換
					break;
					
				case R.id.rb_news:
					mViewPager.setCurrentItem(1,false);
					break;
					
				case R.id.rb_smart:
					mViewPager.setCurrentItem(2,false);
					break;
					
				case R.id.rb_gov:
					mViewPager.setCurrentItem(3,false);
					break;
					
				case R.id.rb_setting:
					mViewPager.setCurrentItem(4,false);
					break;

				default:
					break;
				}
				
				
			}

 

 

 

3.viewpager在指定頁面畫出側邊欄

    基類BasePager根據子類須要設置側板蘭是否可見方法,子類中的initdata中調用

    pagerview數組中的pagerview自動加載三個頁面,若是一次調用Initdata對象會使sliding開關開閉不正常。因此須要pager的一個監聽事件。

 

   BasePager.java

 

//設置側邊欄可見否
	public void setSlidEnable(boolean isEnable){
		MainActivity mainUI=(MainActivity) mActivity;
		SlidingMenu slidingMenu=mainUI.getSlidingMenu();
		
		if(isEnable){
			slidingMenu.setTouchModeAbove(SlidingMenu.TOUCHMODE_FULLSCREEN);
			
		}else
		{
			slidingMenu.setTouchModeAbove(slidingMenu.TOUCHMODE_NONE);
		}

	}

 

 

 

   子類根據須要在initdata中調用

 

@Override
	public void initData() {
		// TODO Auto-generated method stub
		
		
		tvTitle.setText("首頁");
		TextView textView=new TextView(mActivity);
		textView.setText("我是首頁,hahaha!");
		ivSetting.setVisibility(View.GONE);
		setSlidEnable(false);
		
		//向frameLayout裏動態添加布局
		flContent.addView(textView);

		
	}

 

 

主函數Contentfragment.java

寫一個pagerchange事件的監聽,根據選擇來初始化pager對象

 

mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
			
			@Override
			public void onPageSelected(int arg0) {
				// TODO Auto-generated method stub
				mPagerList.get(arg0).initData();  //獲取當前被選中的頁面,初始化頁面數據
				
				
			}
			
			@Override
			public void onPageScrolled(int arg0, float arg1, int arg2) {
				// TODO Auto-generated method stub
				
			}
			
			@Override
			public void onPageScrollStateChanged(int arg0) {
				// TODO Auto-generated method stub
				
			}
		});

 

 


JSON

 

JSON格式

{「name」:"zhangsan","age":18,"books":[

{"name":"金瓶梅",「price」:10},

{"name":"紅雷夢",「price」:20}

]

}

 

瀏覽器json數據亂碼問題->火狐瀏覽器中切換一下編碼方式

 


網絡訪問Json解析(Gson使用+配合xutils)--獲取+解析

一、在Tomcat 8.0\webapps\ROOT目錄下加入接口文件,或者加入到apache服務器下www目錄下

二、建立全局資源

新建global包-》GlobalContants類

 

publicclassGlobalContants {
     
    publicstaticfinalString SERVER_URL="http://10.0.2.2:8080/zhbj";
    publicstaticfinalString  CATEGORIES_URL=SERVER_URL+"/categories.json";
 
}

 

   

url路徑問題:

電腦訪問本機-》localhost、或者(127.。。)

模擬器訪問電腦-》10.0.2.2

 

三、從服務器獲取json數據(string)

使用了引用的lib資源xutils

 

onsuccess和failure都是在主線程中調用

privatevoidgetDataFromServer() {
        // TODO Auto-generated method stub
        HttpUtils httpUtils=newHttpUtils();
              httpUtils.send(HttpMethod.GET, GlobalContants.CATEGORIES_URL,
                newRequestCallBack<String>() {
 
                    @Override
                    publicvoidonSuccess(ResponseInfo responseInfo) {
                        // TODO Auto-generated method stub
                         
                        String  result=(String)responseInfo.result;
                        System.out.println("返回結果"+result);
//                      String result="";
                        parseData(result);
                         
                    }
 
                    @Override
                    publicvoidonFailure(HttpException error, String msg) {
                        // TODO Auto-generated method stub
                        Toast.makeText(mActivity,msg, Toast.LENGTH_LONG).show();
                        error.printStackTrace(); //打印異常
                         
                    }
                });
         
    }
   
1

String  result=(String)responseInfo.result;

 

這裏會出現錯誤-》解決方法:

將路徑sdk\platforms\android-23\optional下的org.apache.http.legacy.jar複製到Libs目錄下.

 

四、將獲取的string格式的json數據解析成對象(GSON使用)

  -  在libs目錄下導入gson包

   http://pan.baidu.com/s/1dFdPVWX

 -   將獲取的string類型的json數據傳入

protectedvoidparseData(String result) {
    // TODO Auto-generated method stub
    Gson gson=newGson();
    NewsData data=gson.fromJson(result,NewsData.class);
     
}
   

  能夠解析出一個NewData.class的對象

  -根據json數據寫一個接受它的對象.注意在寫的時候類中的類型名必定要和Json數據中給的想要接受的數據名稱一致。遇到數組就建立arraylist,遇到數據就直接寫。tips:source能夠自動繼承tostring方法.!

 

 

publicclassNewsData {
     
    publicintretcode;
    publicArrayList<NewMenuData> data;
     
    //側邊欄數據對象
    publicclassNewMenuData{
        publicString id;
        publicString title;
        publicinttype;
        publicString url;
         
        publicArrayList<NewsTabData> children;
 
        @Override
        publicString toString() {
            return"NewMenuData [title="+ title +", children="+ children +"]";
        }
 
         
         
         
    }
     
     
    //新聞頁面下11個子頁籤
    publicclassNewsTabData{
        publicString id;
        publicString title;
        publicinttype;
        publicString url;
        @Override
        publicString toString() {
            return"NewsTabData [title="+ title +"]";
        }
     
    }
 
 
    @Override
    publicString toString() {
        return"NewsData [retcode="+ retcode +", data="+ data +"]";
    }
     
 
}

 


數據傳遞--同一個Activity下的fragment之間數據傳遞

 

將contentfragment一個頁簽下獲取的數據傳到leftMenufragment頁面下。

 -經過獲得共同的activty

-在activity中定義獲取側邊欄Leftmenu的方法

-定義leftmenufragment中set數據方法

-在得到數據頁面經過調用leftmenufragment中get方法將數據傳遞

 

contentfragment下一個頁籤NewsCenterPager.java

//解析網絡數據並將其傳遞給LeftMenu
	protected void parseData(String result) {
		// TODO Auto-generated method stub
		Gson gson=new Gson();
		NewsData data=gson.fromJson(result,NewsData.class);
		
		MainActivity  mainUi=(MainActivity)mActivity;
		LeftMenuFragment leftMenuFragment=mainUi.getLeftMenuFragment();
		
		leftMenuFragment.setMenuData(data);
		
	}

MainActivity中定義獲得側邊欄的方法
	 public LeftMenuFragment getLeftMenuFragment(){
		 
			FragmentManager  fManager=getSupportFragmentManager();
			
			LeftMenuFragment leftMenuFragment=(LeftMenuFragment) fManager.findFragmentByTag(FRAGMENT_LEFT_MENU);
			
			return   leftMenuFragment;
			
	 }

 

leftmenufragment.java中定義設置數據

//設置網絡數據
	public void setMenuData(NewsData data){
		mNewMenuDatas=data.data;
		lvList.setAdapter(new menuAdapter());

 


適配器的使用

-一個List,一個重寫的adpter

 

 

定義
	private ListView lvList;
	
	ArrayList<NewMenuData>   mNewMenuDatas;

設置適配器

	lvList.setAdapter(new menuAdapter());

重寫適配器
	class menuAdapter extends BaseAdapter{

		@Override
		public int getCount() {
			// TODO Auto-generated method stub
			return mNewMenuDatas.size();
		}

		@Override
		public NewMenuData getItem(int position) {
			// TODO Auto-generated method stub
			return mNewMenuDatas.get(position);  //得到arraylist某個指定下標的對象
		}

		@Override
		public long getItemId(int position) {
			// TODO Auto-generated method stub
			return position;
		}

		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			// TODO Auto-generated method stub
			View view=View.inflate(myactivity,R.layout.list_menu_item,null);
			TextView  tvTitle=(TextView) view.findViewById(R.id.tv_title);
			
			NewMenuData newMenuData=getItem(position); 
			tvTitle.setText(newMenuData.title);
			
			return view;
		}
		
	}

 

 

 

R.layout.list_menu_item文件定義了每一個行的樣式

Tips:

 android:drawableLeft="@drawable/btn_menu_selector"  

  android:drawablePadding="5dp"

原來這個代碼能夠給textiew加入圖片

<?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="wrap_content"
    android:orientation="vertical"
    android:padding="10dp" >

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:drawableLeft="@drawable/btn_menu_selector"  
        android:drawablePadding="5dp"
        android:enabled="false"
        android:text="新聞"
        android:textColor="@drawable/text_menu_selector"
        android:textSize="25sp" />

</LinearLayout>

 

-切換側邊欄的狀態

 

SlidingMenu slidingMenu=mainUi.getSlidingMenu();
		slidingMenu.toggle();

 

 

 

   -fragment裏面再內嵌fragment會出現滑動異常--設置事件攔截

-》在新聞中心頁面點擊左側邊欄會實現頁面切換,切換進來的頁面自己又是一個fragment。重寫了外部的fragment會對裏面的fragment影響

-》解決方法:設置事件攔截

 

public NoScrollViewPager(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}

	public NoScrollViewPager(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
	}
	
	
	//表示事件是否攔截,false表示不攔截
	@Override
		public boolean onInterceptTouchEvent(MotionEvent arg0) {
			// TODO Auto-generated method stub
			return false;
		}
	
	

	@Override
	public boolean onTouchEvent(MotionEvent arg0) {
		// TODO Auto-generated method stub
		return false;
	}

}

 

 

引用別人框架時候如何搜索須要的

引入lib和項目不在同一個文件下?

SHA-1

setviewpager在setadapter以後

 


ViewpagerIndicator使用

 

效果圖以下:

 

實現切換頁面下的小頁籤實現頁面跳轉:開源框架ViewpagerIndicator+viewpager的使用

之前太傻了,不會使用別人造好的輪子。

 網盤連接:http://pan.baidu.com/s/1jI93Xzw 

 

-將library包add進須要的項目中

-佈局複製(在導入的demo 演示中找到須要的樣式-》copy)

tips:根據字段在全局中搜索代碼相應位置,search->file->containtext

相關文章
相關標籤/搜索