横向滑动菜单

package com.example.day_02_horizontalscrollview;

import java.util.ArrayList;
import java.util.List;

import com.slidingmenu.lib.SlidingMenu;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.Gravity;
import android.view.View;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.RadioGroup;
import android.widget.TextView;


public class MainActivity extends FragmentActivity {

	private HorizontalScrollView hsv;// 横向滑动的控件
	private LinearLayout nav_ll;// 线性布局容器
	private ViewPager nav_vp;
	private int itemWidth;// 获取每个item的宽度
	private int selectItemIndex = 0;
	private int screenWidth;
	private List<String> type;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		setSlidingMenu();
		type = MyTools.getType();

		// 找控件
		hsv = (HorizontalScrollView) findViewById(R.id.nav_HorizontalScrollView);
		hsv.setHorizontalScrollBarEnabled(false);
		nav_ll = (LinearLayout) findViewById(R.id.nav_ll);

		nav_vp = (ViewPager) findViewById(R.id.nav_vp);

		// 设置导航栏菜单
		setNav();

		// 设置viewpager
		setViewPager();

	}



	private void setViewPager() {
		// 实例化list集合存放fragment
		List<Fragment> fragmentList = new ArrayList<Fragment>();
		for (int i = 0; i < MyTools.getType().size(); i++) {

			MyFragment frame = new MyFragment(type.get(i));
			// 存入list集合
			fragmentList.add(frame);
		}

		// 设置vp适配器
		MyFragmentAdapter fragmentAdapter = new MyFragmentAdapter(
				getSupportFragmentManager(), fragmentList);
		
		nav_vp.setAdapter(fragmentAdapter);

		// 设置vp滑动监听
		nav_vp.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
			@Override
			public void onPageScrolled(int position, float positionOffset,
					int positionOffsetPixels) {

			}

			@Override
			public void onPageSelected(int position) {
				nav_vp.setCurrentItem(position);
				selectType(position);
			}

			@Override
			public void onPageScrollStateChanged(int state) {

			}
		});
	}

	private void setNav() {

		// 获得屏幕总宽度
		DisplayMetrics metrics = new DisplayMetrics();
		getWindowManager().getDefaultDisplay().getMetrics(metrics);
		screenWidth = metrics.widthPixels;
		
		
		// 设置每一个item的宽度
		itemWidth = screenWidth / type.size();
		Log.i("---->", MyTools.getType().toString());
		
		for (int i = 0; i < MyTools.getType().size(); i++) {
			
			
			LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
					itemWidth, RadioGroup.LayoutParams.WRAP_CONTENT);
			
			// 设置外边距
			params.leftMargin = 10;
			params.rightMargin = 10;

			// 创建TextView的实例
			TextView localTextView = new TextView(this);
			// 设置tv的属性
			localTextView.setText(MyTools.getType().get(i));
			localTextView.setTextSize(16.0f);
			localTextView.setBackgroundResource(R.drawable.nav_tv_bg);
			localTextView.setPadding(5, 15, 5, 15);
			localTextView.setGravity(Gravity.CENTER);
		
			if (selectItemIndex == i) {
				localTextView.setSelected(true);
			}
			// 设置每一个tv的监听
			localTextView.setOnClickListener(new View.OnClickListener() {
				@Override
				public void onClick(View v) {

					for (int i = 0; i < nav_ll.getChildCount(); i++) {
						TextView tv = (TextView) nav_ll.getChildAt(i);
						if (tv == v) {
							tv.setSelected(true);
							nav_vp.setCurrentItem(i);
						} else {
							tv.setSelected(false);
						}
					}

				}
			});
			nav_ll.addView(localTextView, i, params);
		}
	}

	
	
	public void selectType(int tab_position) {
		selectItemIndex = tab_position;
		// 通过自动滚动
		for (int i = 0; i < nav_ll.getChildCount(); i++) {
			
			TextView tv0 = (TextView) nav_ll.getChildAt(tab_position);
			
			int k = tv0.getMeasuredWidth();
			int l = tv0.getLeft();
			int i2 = l + k / 2 - screenWidth / 2;// 计算要滚动到的位置
		
			hsv.smoothScrollTo(i2, 0);
			
			View view = nav_ll.getChildAt(i);
			if (tab_position == i) {
				view.setSelected(true);
			} else {
				view.setSelected(false);
			}
		}
		
		// 判断哪一个tv被选中设置背景颜色
		for (int i = 0; i < nav_ll.getChildCount(); i++) {
		
		}
	}
	
	/**
	 * 
	 */
	private void setSlidingMenu() {
    SlidingMenu menu=new SlidingMenu(this);		
	

	menu.setMode(SlidingMenu.RIGHT);				//2
	menu.setMenu(R.layout.leftmenu);			//------!!!为侧滑菜单设置布局
	// 设置触摸屏幕的模式
	menu.setTouchModeAbove(SlidingMenu.TOUCHMODE_MARGIN);//3滑出菜单的模式
	menu.setShadowWidth(50);		//4
//	menu.setShadowDrawable(R.drawable.shadow);			//5是个渐变shape文件
	// 设置滑动菜单打开后内容页所留的可滑动部分的宽为80dp
	menu.setBehindOffset(120);
	// 设置渐入渐出效果的变化程度1.0为关闭时纯黑
	menu.setFadeDegree(1.0f);	
	menu.setBehindScrollScale(0.2f);
	//7
	// 把SlidingMenu附加在Activity上  可取值为:SLIDING_CONTENT,SLIDING_WINDOW
	// SlidingMenu.SLIDING_WINDOW:菜单拉开后高度是全屏的  
	// SlidingMenu.SLIDING_CONTENT:菜单拉开后高度是不包含Title/ActionBar的内容区域  
	menu.attachToActivity(this, SlidingMenu.SLIDING_WINDOW);//8 左菜单有title栏-------!!!
	}
}

==========================================================================================================

/**
 * 
 */
package com.example.day_02_horizontalscrollview;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;


/**
 * @author WJL
 * 
 */
public class MyFragment extends Fragment {
	String text;


	public MyFragment(String text) {
		this.text = text;


	}


	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {


		View view = View.inflate(getActivity(), R.layout.fragment, null);
		TextView tv = (TextView) view.findViewById(R.id.tv);
		tv.setText(text);
		return view;
	}
}
========================================================================================================

package com.example.day_02_horizontalscrollview;


import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

/**
 * Created by Administrator on 2016/2/18.
 */
public class MyFragmentAdapter extends FragmentPagerAdapter {
    private List<Fragment> fragmentList;

    public MyFragmentAdapter(FragmentManager fm, List<Fragment> fragmentList) {
        super(fm);
        this.fragmentList = fragmentList;
    }

    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }

    @Override
    public int getCount() {
        return fragmentList.size();
    }
}

==================================================================================================

package com.example.day_02_horizontalscrollview;




import java.util.Arrays;
import java.util.List;
import java.util.Map;
import java.util.TreeMap;


/**
 * Created by Administrator on 2016/2/22.
 */
public class MyTools {
    public static Map<String, String> getData() {
        Map<String, String> map = new TreeMap<String, String>();
        map.put("推荐", "http://ic.snssdk.com/2/article/v14/stream/?image=1&count=20&min_behot_time=1455594227&iid=3641392726&device_id=10789635067&ac=wifi&channel=dearclick31&aid=13&app_name=news_article&version_code=330&device_platform=android&device_type=Coolpad%208297&os_api=17&os_version=4.2.2&uuid=863777029390464&openudid=17de2106c58527f4&detail=");
        map.put("热点", "http://ic.snssdk.com/2/article/v14/stream/?image=1&category=news_hot&count=20&iid=3641392726&device_id=10789635067&ac=wifi&channel=dearclick31&aid=13&app_name=news_article&version_code=330&device_platform=android&device_type=Coolpad%208297&os_api=17&os_version=4.2.2&uuid=863777029390464&openudid=17de2106c58527f4&detail=");
        map.put("北京", "http://ic.snssdk.com/2/article/v14/stream/?image=1&category=news_local&count=20&iid=3641392726&device_id=10789635067&ac=wifi&channel=dearclick31&aid=13&app_name=news_article&version_code=330&device_platform=android&device_type=Coolpad%208297&os_api=17&os_version=4.2.2&uuid=863777029390464&openudid=17de2106c58527f4&detail=");
        map.put("社会", "http://ic.snssdk.com/2/article/v14/stream/?image=1&category=news_society&count=20&iid=3641392726&device_id=10789635067&ac=wifi&channel=dearclick31&aid=13&app_name=news_article&version_code=330&device_platform=android&device_type=Coolpad%208297&os_api=17&os_version=4.2.2&uuid=863777029390464&openudid=17de2106c58527f4&detail=");
        map.put("娱乐", "http://ic.snssdk.com/2/article/v14/stream/?image=1&category=news_entertainment&count=20&iid=3641392726&device_id=10789635067&ac=wifi&channel=dearclick31&aid=13&app_name=news_article&version_code=330&device_platform=android&device_type=Coolpad%208297&os_api=17&os_version=4.2.2&uuid=863777029390464&openudid=17de2106c58527f4&detail=");
        map.put("科技", "http://ic.snssdk.com/2/article/v14/stream/?image=1&category=news_tech&count=20&min_behot_time=1455786887&tt_from=tip&iid=3641392726&device_id=10789635067&ac=wifi&channel=dearclick31&aid=13&app_name=news_article&version_code=330&device_platform=android&device_type=Coolpad%208297&os_api=17&os_version=4.2.2&uuid=863777029390464&openudid=17de2106c58527f4&detail=");
        map.put("视频", "http://c.m.163.com/nc/video/home/0-10.html");




        return map;


    }


    public static List<String> getType() {
        List<String> typeList = Arrays.asList("推荐", "热点", "北京", "社会", "娱乐", "科技", "视频");
//        Set<String> keySet = getData().keySet();
//        Collection<String> values = getData().values();
//        Iterator<String> stringIterator = values.iterator();
//        while (stringIterator.hasNext()){
//            String next = stringIterator.next();
//        }
//        TreeSet<String> treeSet=new TreeSet<>();
//        treeSet.addAll(keySet);
//
//
//        Iterator<String> iterator = keySet.iterator();
//        while (iterator.hasNext()) {
//            String next = iterator.next();
//            typeList.add(next);
//        }


        return typeList;
    }


}
===============================================================================================

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal">

        <HorizontalScrollView
            android:id="@+id/nav_HorizontalScrollView"
            android:layout_width="0dp"
            android:layout_height="50dp"
            android:layout_weight="9"
            
            android:fillViewport="true">

            <LinearLayout
                android:id="@+id/nav_ll"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                
                
                
                
                
            </LinearLayout>
        </HorizontalScrollView>



    </LinearLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/nav_vp"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

</LinearLayout>
==================================================================================

<?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="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/tv"
        android:layout_gravity="center"
        android:layout_width="200dp"
        android:textSize="50sp"
        android:layout_height="200dp"
        android:text="类型" />

</LinearLayout>
============================================================================================

<?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="match_parent"
    android:background="#ff0"
    android:orientation="vertical" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="Hello Sliding Menu!" />

</LinearLayout>

===============================================================================================

res文件下drawable中的nav_tv_bg.xml文件

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">



    <item android:state_selected="true">
        <shape>
            <gradient android:angle="270.0" android:endColor="#ffcc3131" android:startColor="#ffcc3131" />

            <corners android:radius="2.0dip" />
        </shape>
    </item>

    <item>
        <shape>
            <gradient android:angle="270.0" android:endColor="#00000000" android:startColor="#00000000" />

            <corners android:radius="2.0dip" />
        </shape>
    </item>
</selector>






  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta name="keywords" content="JS代码,菜单导航,JS广告代码,JS特效代码" /> <meta name="description" content="此代码内容为巧克力jQuery横向二级滑动导航菜单,属于站长常用代码,更多菜单导航代码请访问懒人图库JS代码频道。" /> <title>巧克力jQuery横向二级滑动导航菜单_懒人图库</title> <link href="css/lrtk.css" rel="stylesheet" type="text/css" /> <script language="javascript" type="text/javascript" src="js/jquery-1.4.2.js"></script> <script language="javascript" type="text/javascript" src="js/lrtk.js"></script> </head> <body> <!-- 代码 开始 --> <div id="menu"> <ul id="nav"> <li class="mainlevel"><span class="note">首页</span></li> <li class="mainlevel" id="mainlevel_01"><a href="#">环境可视化</a> <ul class="sub_nav_01"> <span class="Triangle_con"></span> <li><a href="#">空调</a></li> <li><a href="#">电量仪</a></li> <li><a href="#">温度</a></li> </ul> </li> <li class="mainlevel" id="mainlevel_02"><a href="#">容量可视化</a> <ul class="sub_nav_01"> <span class="Triangle_con"></span> <li><a href="#">电力功耗</a></li> <li><a href="#">机柜承重</a></li> <li><a href="#">空余U位</a></li> <li><a href="#">机柜位置</a></li> </ul> </li> <li class="mainlevel"><a href="#">管线可视化</a> <ul class="sub_nav_01"> <span class="Triangle_con"></span> <li><a href="#">供电管路</a></li> </ul> </li> <li class="mainlevel"><a href="#">监控可视化</a><!--input an em tag as a space,IE is gread need--> <ul class="sub_nav_01"> <span class="Triangle_con"></span> <li><a href="#">安防设施</a></li> <li><a href="#">云图</a></li> <li><a href="#">气流</a></li> </ul> </li> <li class="mainlevel"><a href="#">演示可视化</a> <ul class="sub_nav_01"> <span class="Triangle_con"></span> <li><a href="#">动画演示</a></li> <li><a href="#">安防设施</a></li> </ul> </li> </ul> </div> <!-- 代码 结束 --> </body> </html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值