码迷,mamicode.com
首页 > 移动开发 > 详细

Android第三十八期 - 评价标签FlowLayout

时间:2015-06-19 21:50:01      阅读:265      评论:0      收藏:0      [点我收藏+]

标签:android   标签   

    代码已经整理好,这里要说一下,因为手动和Json获取写法不一样。

    手动直接xml设置:  

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#E1E6F6"
    android:orientation="vertical" >

    <com.zhy.zhy_flowlayout02.FlowLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >

        <TextView
            style="@style/text_flag_01"
            android:text="Welcome" />

        <TextView
            style="@style/text_flag_01"
            android:text="IT工程师" />

        <TextView
            style="@style/text_flag_01"
            android:text="学习ing" />

        <TextView
            style="@style/text_flag_01"
            android:text="恋爱ing" />

        <TextView
            style="@style/text_flag_01"
            android:text="挣钱ing" />

        <TextView
            style="@style/text_flag_01"
            android:text="努力ing" />

        <TextView
            style="@style/text_flag_01"
            android:text="I thick i can" />
    </com.zhy.zhy_flowlayout02.FlowLayout>
    

    <com.zhy.zhy_flowlayout02.FlowLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp" >

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_02"
            android:text="Welcome"
            android:textColor="#888888" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_02"
            android:text="IT工程师"
            android:textColor="#888888" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_02"
            android:text="学习ing"
            android:textColor="#888888" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_02"
            android:text="恋爱ing"
            android:textColor="#888888" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_02"
            android:text="挣钱ing"
            android:textColor="#888888" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_02"
            android:text="努力ing"
            android:textColor="#888888" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_02"
            android:text="I thick i can"
            android:textColor="#888888" />
    </com.zhy.zhy_flowlayout02.FlowLayout>

    <com.zhy.zhy_flowlayout02.FlowLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp" >

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_03"
            android:text="Welcome"
            android:textColor="#43BBE7" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_03"
            android:text="IT工程师"
            android:textColor="#43BBE7" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_03"
            android:text="学习ing"
            android:textColor="#43BBE7" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_03"
            android:text="恋爱ing"
            android:textColor="#43BBE7" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_03"
            android:text="挣钱ing"
            android:textColor="#43BBE7" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_03"
            android:text="努力ing"
            android:textColor="#43BBE7" />

        <TextView
            style="@style/text_flag_01"
            android:background="@drawable/flag_03"
            android:text="I thick i can"
            android:textColor="#43BBE7" />
    </com.zhy.zhy_flowlayout02.FlowLayout>

</LinearLayout>

    效果如下:

    技术分享

    Json获取:

    if(message.what == 1) {
        // 处理操作
        pingjia = newArrayList<Pingjia>();
        pingjia.addAll(JsonUtils.getBeanList(message.result,"Items",
        Pingjia.class));
        FlowLayout layout = (FlowLayout)findViewById(R.id.layou23);
        LinearLayout.LayoutParams params = newLinearLayout.LayoutParams(
        LinearLayout.LayoutParams.WRAP_CONTENT,
        LinearLayout.LayoutParams.WRAP_CONTENT);
        params.gravity =Gravity.CENTER_VERTICAL;
         
        // 加载TextView
        for (int i = 0; i < pingjia.size();i++) {
        Pingjia ping = pingjia.get(i);
        tvNav = new TextView(this);
        tvNav.setTextSize(13.f);
        // tvNav.setWidth((int)Math.floor(Double.valueOf(a)));
        // tvNav.setHeight((int)Math.floor(Double.valueOf(b)));
        tvNav.setText(ping.getContent());
        tvNav.setId(ping.getId());
        tvNav.setBackgroundResource(R.anim.flag_022);
        tvNav.setTag(false);
        tvNav.setTextColor(getResources().getColor(R.color.gray));
        // tvNav.setPadding(30, 10, 30, 10);
        // tvNav.setGravity(Gravity.CENTER_HORIZONTAL);
        tvNav.setOnClickListener(newTvClickListener(tvNav));
        layout.addView(tvNav, params);
    }
    
    
    private TextView tvNav;
	private String str = "";
	private String strId = "";

	/**
	 * 标题栏textview 点击事件
	 * 
	 * @author fei
	 * 
	 */
	private final class TvClickListener implements View.OnClickListener {
		// private int index;
		private TextView tvNav;

		public TvClickListener(TextView tvNav) {
			super();
			// this.index = index;
			this.tvNav = tvNav;
		}

		@Override
		public void onClick(View v) {
			Boolean isclick = (Boolean) tvNav.getTag();
			if (!isclick) {
				tvNav.setBackgroundResource(R.anim.flag_0444);
				tvNav.setTextColor(getResources().getColor(R.color.red));
				tvNav.setTag(true);
				// 显示到上面
				str = str + tvNav.getText().toString() + ",";
				ed_en.setText(str);
				// 记录Id
				strId = strId + tvNav.getId() + ",";
				// strId = strId.substring(0, strId.length() - 1);
				// MyLogUtil.v("传->strId", strId);
			} else {
				tvNav.setBackgroundResource(R.anim.flag_022);
				tvNav.setTextColor(getResources().getColor(R.color.gray));
				tvNav.setTag(false);
				// 显示到上面
				str = str.replace(tvNav.getText().toString() + ",", "");
				ed_en.setText(str);
				// 记录Id
				strId = strId.replace(tvNav.getId() + ",", "");
				// strId = strId.substring(0, strId.length() - 1);
				// MyLogUtil.v("Delete->strId", strId);
			}
			// ToastUtil.showToastLong(tvNav.getId() + ","
			// + tvNav.getText().toString());
		}
	}

    xml设置:

     <LinearLayout
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="@dimen/dimens_10"
                    android:layout_marginLeft="@dimen/x10"
                    android:layout_marginRight="@dimen/x10"
                    android:layout_marginTop="@dimen/y20"
                    android:orientation="vertical" >

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:drawableLeft="@drawable/biaoqian1"
                        android:drawablePadding="@dimen/dimens_10"
                        android:text="@string/bq3"
                        android:textColor="@color/black"
                        android:textSize="15sp" />

                    <com.kangxin.patient.utils.FlowLayout
                        android:id="@+id/layou23"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="@dimen/y10"
                        android:orientation="vertical" >
                    </com.kangxin.patient.utils.FlowLayout>
                </LinearLayout>

    效果如下:

    技术分享

    最后是自定义layout类FlowLayout:

package com.zhy.zhy_flowlayout02;

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

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;

public class FlowLayout extends ViewGroup
{

	private static final String TAG = "FlowLayout";


	public FlowLayout(Context context, AttributeSet attrs)
	{
		super(context, attrs);
	}

	@Override
	protected ViewGroup.LayoutParams generateLayoutParams(
			ViewGroup.LayoutParams p)
	{
		return new MarginLayoutParams(p);
	}

	@Override
	public ViewGroup.LayoutParams generateLayoutParams(AttributeSet attrs)
	{
		return new MarginLayoutParams(getContext(), attrs);
	}

	@Override
	protected ViewGroup.LayoutParams generateDefaultLayoutParams()
	{
		return new MarginLayoutParams(LayoutParams.MATCH_PARENT,
				LayoutParams.MATCH_PARENT);
	}

	/**
	 * 负责设置子控件的测量模式和大小 根据所有子控件设置自己的宽和高
	 */
	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
	{
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		// 获得它的父容器为它设置的测量模式和大小
		int sizeWidth = MeasureSpec.getSize(widthMeasureSpec);
		int sizeHeight = MeasureSpec.getSize(heightMeasureSpec);
		int modeWidth = MeasureSpec.getMode(widthMeasureSpec);
		int modeHeight = MeasureSpec.getMode(heightMeasureSpec);

		Log.e(TAG, sizeWidth + "," + sizeHeight);

		// 如果是warp_content情况下,记录宽和高
		int width = 0;
		int height = 0;
		/**
		 * 记录每一行的宽度,width不断取最大宽度
		 */
		int lineWidth = 0;
		/**
		 * 每一行的高度,累加至height
		 */
		int lineHeight = 0;

		int cCount = getChildCount();

		// 遍历每个子元素
		for (int i = 0; i < cCount; i++)
		{
			View child = getChildAt(i);
			// 测量每一个child的宽和高
			measureChild(child, widthMeasureSpec, heightMeasureSpec);
			// 得到child的lp
			MarginLayoutParams lp = (MarginLayoutParams) child
					.getLayoutParams();
			// 当前子空间实际占据的宽度
			int childWidth = child.getMeasuredWidth() + lp.leftMargin
					+ lp.rightMargin;
			// 当前子空间实际占据的高度
			int childHeight = child.getMeasuredHeight() + lp.topMargin
					+ lp.bottomMargin;
			/**
			 * 如果加入当前child,则超出最大宽度,则的到目前最大宽度给width,类加height 然后开启新行
			 */
			if (lineWidth + childWidth > sizeWidth)
			{
				width = Math.max(lineWidth, childWidth);// 取最大的
				lineWidth = childWidth; // 重新开启新行,开始记录
				// 叠加当前高度,
				height += lineHeight;
				// 开启记录下一行的高度
				lineHeight = childHeight;
			} else
			// 否则累加值lineWidth,lineHeight取最大高度
			{
				lineWidth += childWidth;
				lineHeight = Math.max(lineHeight, childHeight);
			}
			// 如果是最后一个,则将当前记录的最大宽度和当前lineWidth做比较
			if (i == cCount - 1)
			{
				width = Math.max(width, lineWidth);
				height += lineHeight;
			}

		}
		setMeasuredDimension((modeWidth == MeasureSpec.EXACTLY) ? sizeWidth
				: width, (modeHeight == MeasureSpec.EXACTLY) ? sizeHeight
				: height);

	}
	/**
	 * 存储所有的View,按行记录
	 */
	private List<List<View>> mAllViews = new ArrayList<List<View>>();
	/**
	 * 记录每一行的最大高度
	 */
	private List<Integer> mLineHeight = new ArrayList<Integer>();
	@Override
	protected void onLayout(boolean changed, int l, int t, int r, int b)
	{
		mAllViews.clear();
		mLineHeight.clear();

		int width = getWidth();

		int lineWidth = 0;
		int lineHeight = 0;
		// 存储每一行所有的childView
		List<View> lineViews = new ArrayList<View>();
		int cCount = getChildCount();
		// 遍历所有的孩子
		for (int i = 0; i < cCount; i++)
		{
			View child = getChildAt(i);
			MarginLayoutParams lp = (MarginLayoutParams) child
					.getLayoutParams();
			int childWidth = child.getMeasuredWidth();
			int childHeight = child.getMeasuredHeight();

			// 如果已经需要换行
			if (childWidth + lp.leftMargin + lp.rightMargin + lineWidth > width)
			{
				// 记录这一行所有的View以及最大高度
				mLineHeight.add(lineHeight);
				// 将当前行的childView保存,然后开启新的ArrayList保存下一行的childView
				mAllViews.add(lineViews);
				lineWidth = 0;// 重置行宽
				lineViews = new ArrayList<View>();
			}
			/**
			 * 如果不需要换行,则累加
			 */
			lineWidth += childWidth + lp.leftMargin + lp.rightMargin;
			lineHeight = Math.max(lineHeight, childHeight + lp.topMargin
					+ lp.bottomMargin);
			lineViews.add(child);
		}
		// 记录最后一行
		mLineHeight.add(lineHeight);
		mAllViews.add(lineViews);

		int left = 0;
		int top = 0;
		// 得到总行数
		int lineNums = mAllViews.size();
		for (int i = 0; i < lineNums; i++)
		{
			// 每一行的所有的views
			lineViews = mAllViews.get(i);
			// 当前行的最大高度
			lineHeight = mLineHeight.get(i);

			Log.e(TAG, "第" + i + "行 :" + lineViews.size() + " , " + lineViews);
			Log.e(TAG, "第" + i + "行, :" + lineHeight);

			// 遍历当前行所有的View
			for (int j = 0; j < lineViews.size(); j++)
			{
				View child = lineViews.get(j);
				if (child.getVisibility() == View.GONE)
				{
					continue;
				}
				MarginLayoutParams lp = (MarginLayoutParams) child
						.getLayoutParams();

				//计算childView的left,top,right,bottom
				int lc = left + lp.leftMargin;
				int tc = top + lp.topMargin;
				int rc =lc + child.getMeasuredWidth();
				int bc = tc + child.getMeasuredHeight();

				Log.e(TAG, child + " , l = " + lc + " , t = " + t + " , r ="
						+ rc + " , b = " + bc);

				child.layout(lc, tc, rc, bc);
				
				left += child.getMeasuredWidth() + lp.rightMargin
						+ lp.leftMargin;
			}
			left = 0;
			top += lineHeight;
		}

	}
}

    最后感谢 hongyang大神~Loader大神~

    技术分享

本文出自 “梁肖技术中心” 博客,请务必保留此出处http://liangxiao.blog.51cto.com/3626612/1663535

Android第三十八期 - 评价标签FlowLayout

标签:android   标签   

原文地址:http://liangxiao.blog.51cto.com/3626612/1663535

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!