【多級樹形菜單-dialog自定義動畫彈出方式-手勢監聽】android實現treeView

工作需要，這兩天晚上弄的都是多級樹形菜單。

通過按鈕或者手勢觸發一個側滑出的多級品類菜單，實現思路如下：

1.觸發事件：button的onClick的監聽時間、手勢的左滑觸發

2.彈出效果和控件選擇：dialog的自定義類和自定義的style搭配使用，從而自定義dialog

3.多級樹形菜單的實現

4.網絡json數據請求後對數據的解析格式化以及對樹形菜單節點的適配

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

樹形菜單實現（大部分爲網絡博客學習） 樹形菜單原文

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

1.Model——結點的model類

public class Element {
	/** 文字內容 */
	private String contentText;
	/** 在tree中的層級 */
	private int level;
	/** 元素的id */
	private int id;
	/** 父元素的id */
	private int parendId;
	/** 是否有子元素 */
	private boolean hasChildren;
	/** item是否展開 */
	private boolean isExpanded;
	
	/** 表示該節點沒有父元素，也就是level爲0的節點 */
	public static final int NO_PARENT = -1;
	/** 表示該元素位於最頂層的層級 */
	public static final int TOP_LEVEL = 1;
	
	public Element(String contentText, int level, int id, int parendId,
			boolean hasChildren, boolean isExpanded) {
		super();
		this.contentText = contentText;
		this.level = level;
		this.id = id;
		this.parendId = parendId;
		this.hasChildren = hasChildren;
		this.isExpanded = isExpanded;
	}

	// getter & setter
}

2.Dialog 自定義類

public class TreeViewDialog extends Dialog {
	
	Context context;
	
	private ListView treeview;
	
	/** 樹中的元素集合 */
	private ArrayList<Element> elements;
	/** 數據源元素集合 */
	private ArrayList<Element> elementsData;

	public TreeViewDialog(Context context) {
		super(context);
		this.context = context;
	}
	
	public TreeViewDialog(Context context, int theme) {
		super(context,theme);
		this.context = context;
	}

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		this.setContentView(R.layout.store_category_treeview_dialog_layout);
		
		LayoutInflater inflater = (LayoutInflater) LayoutInflater.from(context);
		init();
		
		treeview = (ListView) findViewById(R.id.store_category_treeview);
		TreeViewAdapter treeViewAdapter = new TreeViewAdapter(elements, elementsData, inflater);
		TreeViewItemClickListener treeViewItemClickListener = new TreeViewItemClickListener(treeViewAdapter);
		treeview.setAdapter(treeViewAdapter);
		treeview.setOnItemClickListener(treeViewItemClickListener);
		
	}
	
	private void init() {
		elements = new ArrayList<Element>();
		elementsData = new ArrayList<Element>();
		
		Element coat = new Element("服飾鞋帽", Element.TOP_LEVEL, 1315, Element.NO_PARENT, true, false);
		Element maleCoat = new Element("男裝", Element.TOP_LEVEL + 1, 1342, 1315, true, false);
		Element shirt = new Element("襯衫", Element.TOP_LEVEL + 2, 1348, 1342, false, false);
		
		elements.add(coat);
		
		elementsData.add(coat);
		elementsData.add(maleCoat);
		elementsData.add(shirt);
		
		//添加節點  -- 節點名稱，節點level，節點id，父節點id，是否有子節點，是否展開
		
	}
	
	

}

3.Dialog自定義style

<style name="TreeViewDialog" parent="@android:Theme.Dialog">
        <item name="android:windowFrame">@null</item><!--邊框-->
        <item name="android:windowIsFloating">true</item><!--是否浮現在activity之上-->
        <item name="android:windowIsTranslucent">false</item><!--半透明-->
        <item name="android:windowNoTitle">true</item><!--無標題-->
        <item name="android:windowBackground">@android:color/white</item><!--背景透明-->
        <item name="android:backgroundDimEnabled">false</item><!--模糊-->
</style>

4.Dialog中TreeView的每個Item的Adapter和監聽事件，主要負責菜單的展開等

public class TreeViewAdapter extends BaseAdapter {
	/** 元素數據源 */
	private ArrayList<Element> elementsData;
	/** 樹中元素 */
	private ArrayList<Element> elements;
	/** LayoutInflater */
	private LayoutInflater inflater;
	/** item的行首縮進基數 */
	private int indentionBase;
	
	public TreeViewAdapter(ArrayList<Element> elements, ArrayList<Element> elementsData, LayoutInflater inflater) {
		this.elements = elements;
		this.elementsData = elementsData;
		this.inflater = inflater;
		indentionBase = 15;
	}
	
	public ArrayList<Element> getElements() {
		return elements;
	}
	
	public ArrayList<Element> getElementsData() {
		return elementsData;
	}
	
	@Override
	public int getCount() {
		return elements.size();
	}

	@Override
	public Object getItem(int position) {
		return elements.get(position);
	}

	@Override
	public long getItemId(int position) {
		return position;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		ViewHolder holder = null;
		if (convertView == null) {
			holder = new ViewHolder();
			convertView = inflater.inflate(R.layout.store_catefory_treeview_item, null);
			holder.disclosureImg = (ImageView) convertView.findViewById(R.id.disclosureImg);
			holder.contentText = (TextView) convertView.findViewById(R.id.contentText);
			convertView.setTag(holder);
		} else {
			holder = (ViewHolder) convertView.getTag();
		}
		Element element = elements.get(position);
		int level = element.getLevel();
		holder.contentText.setPadding(
				indentionBase * (level - 1), 
				holder.disclosureImg.getPaddingTop(), 
				holder.disclosureImg.getPaddingRight(), 
				holder.disclosureImg.getPaddingBottom());
		holder.contentText.setText(element.getContentText());
		if (element.isHasChildren() && !element.isExpanded()) {
			holder.disclosureImg.setImageResource(R.drawable.com_lable_arrow_dropdown);
			//這裏要主動設置一下icon可見，因爲convertView有可能是重用了"設置了不可見"的view，下同。
			holder.disclosureImg.setVisibility(View.VISIBLE);
		} else if (element.isHasChildren() && element.isExpanded()) {
			holder.disclosureImg.setImageResource(R.drawable.com_lable_arrow_pickup);
			holder.disclosureImg.setVisibility(View.VISIBLE);
		} else if (!element.isHasChildren()) {
			holder.disclosureImg.setImageResource(R.drawable.com_lable_arrow_dropdown);
			holder.disclosureImg.setVisibility(View.INVISIBLE);
		}
		return convertView;
	}
	
	/**
	 * 優化Holder
	 * @author liushiyao
	 *
	 */
	static class ViewHolder{
		ImageView disclosureImg;
		TextView contentText;
	}
}

監聽事件重寫

public class TreeViewItemClickListener implements OnItemClickListener {
	/** adapter */
	private TreeViewAdapter treeViewAdapter;
	
	public TreeViewItemClickListener(TreeViewAdapter treeViewAdapter) {
		this.treeViewAdapter = treeViewAdapter;
	}
	
	@Override
	public void onItemClick(AdapterView<?> parent, View view, int position,
			long id) {
		//點擊的item代表的元素
		Element element = (Element) treeViewAdapter.getItem(position);
		//樹中的元素
		ArrayList<Element> elements = treeViewAdapter.getElements();
		//元素的數據源
		ArrayList<Element> elementsData = treeViewAdapter.getElementsData();
		
		//點擊沒有子項的item直接返回
		if (!element.isHasChildren()) {
			return;
		}
		
		if (element.isExpanded()) {
			element.setExpanded(false);
			//刪除節點內部對應子節點數據，包括子節點的子節點...
			ArrayList<Element> elementsToDel = new ArrayList<Element>();
			for (int i = position + 1; i < elements.size(); i++) {
				if (element.getLevel() >= elements.get(i).getLevel())
					break;
				elementsToDel.add(elements.get(i));
			}
			elements.removeAll(elementsToDel);
			treeViewAdapter.notifyDataSetChanged();
		} else {
			element.setExpanded(true);
			//從數據源中提取子節點數據添加進樹，注意這裏只是添加了下一級子節點，爲了簡化邏輯
			int i = 1;//注意這裏的計數器放在for外面才能保證計數有效
			for (Element e : elementsData) {
				if (e.getParendId() == element.getId()) {
					e.setExpanded(false);
					elements.add(position + i, e);
					i ++;
				}
			}
			treeViewAdapter.notifyDataSetChanged();
		}
	}

}

5.在Activity中對dialog進行聲明展示

		// 商品品類對話框聲明對象 & 設置相應屬性
		categoryDialog = new TreeViewDialog(StoreActivity.this, R.style.TreeViewDialog);
		Window win = categoryDialog.getWindow();
		LayoutParams params = new LayoutParams();
		WindowManager wm = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
		int width = wm.getDefaultDisplay().getWidth();
		int height = wm.getDefaultDisplay().getHeight();
		params.x = width;// 設置x座標
		params.y = 0;// 設置y座標
		win.setAttributes(params);
		win.setWindowAnimations(R.style.dialog_animation_style);
		// 商品品類對話框聲明對象 & 設置相應屬性 end

<pre name="code" class="java"><span style="white-space:pre">		</span>categoryDialog<span style="font-family: Arial, Helvetica, sans-serif;">.show();</span>

整體工程代碼地址稍後給出點擊打開鏈接