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

相关文章
相关标签/搜索