【Android進階】多抽屜效果 （類似最早QQ使用的效果）

 

也不知道該怎麼取名，暫且就叫他多抽屜效果吧~~  最早QQ就是這樣的效果，點一下，還有聲音，呵呵。

 

一晃，都過去那麼多年了...

 

 

廢話不多說了，看下效果：

 

 

 

這個就是類似抽屜的效果，這邊做了三個抽屜，點擊抽屜既可開啟，同時關閉其他抽屜。

 

有人猜到怎麼做的了嗎？

 

其實很簡單，就是三個 TextView + 三個Layout。 關鍵就在於控制Layout的顯示、消失。同時也要注意Layoout的權重值weight。

 

下面看一下代碼吧。

 

頁面 main.xml :

<?xml version="1.0" encoding="utf-8"?><br /><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"<br />android:orientation="vertical" android:layout_width="fill_parent"<br />android:layout_height="fill_parent"><br /><TextView android:id="@+id/tv01" android:layout_width="fill_parent"<br />android:layout_height="wrap_content" android:text="@string/label1"<br />android:background="@drawable/line" android:clickable="true" /><br /><LinearLayout android:id="@+id/layout1"<br />android:layout_width="fill_parent" android:layout_height="wrap_content"<br />android:layout_weight="1"><br /><TextView android:layout_width="fill_parent"<br />android:layout_height="wrap_content" android:text="內容1" /><br /></LinearLayout><br /><TextView android:id="@+id/tv02" android:layout_width="fill_parent"<br />android:layout_height="wrap_content" android:text="@string/label2"<br />android:background="@drawable/line" android:clickable="true" /><br /><LinearLayout android:id="@+id/layout2"<br />android:layout_width="fill_parent" android:layout_height="wrap_content"<br />android:layout_weight="1"><br /><TextView android:layout_width="fill_parent"<br />android:layout_height="wrap_content" android:text="內容2" /><br /></LinearLayout><br /><TextView android:id="@+id/tv03" android:layout_width="fill_parent"<br />android:layout_height="wrap_content" android:text="@string/label2"<br />android:background="@drawable/line" android:clickable="true" /><br /><LinearLayout android:id="@+id/layout3"<br />android:layout_width="fill_parent" android:layout_height="fill_parent"<br />android:layout_weight="0"><br /><TextView android:layout_width="fill_parent"<br />android:layout_height="wrap_content" android:text="內容3" /><br /></LinearLayout><br /></LinearLayout><br /> 

 

Java代碼，就一個類：

package com.yfz;<br />import android.app.Activity;<br />import android.os.Bundle;<br />import android.view.View;<br />import android.widget.LinearLayout;<br />import android.widget.TextView;<br />public class QQ extends Activity {<br />private TextView tv1;<br />private TextView tv2;<br />private TextView tv3;</p><p>private LinearLayout layout1;<br />private LinearLayout layout2;<br />private LinearLayout layout3;</p><p> /** Called when the activity is first created. */<br /> @Override<br /> public void onCreate(Bundle savedInstanceState) {<br /> super.onCreate(savedInstanceState);<br /> setContentView(R.layout.main);<br /> setupView();<br /> }<br />private void setupView() {<br />tv1 =(TextView) findViewById(R.id.tv01);<br />tv2 =(TextView) findViewById(R.id.tv02);<br />tv3 =(TextView) findViewById(R.id.tv03);</p><p>layout1 = (LinearLayout)findViewById(R.id.layout1);<br />layout2 = (LinearLayout)findViewById(R.id.layout2);<br />layout3 = (LinearLayout)findViewById(R.id.layout3);</p><p>tv1.setOnClickListener(new View.OnClickListener() {</p><p>@Override<br />public void onClick(View v) {<br />layout1.setVisibility(View.VISIBLE);<br />layout2.setVisibility(View.GONE);<br />layout3.setVisibility(View.GONE);<br />}<br />});</p><p>tv2.setOnClickListener(new View.OnClickListener() {</p><p>@Override<br />public void onClick(View v) {<br />layout1.setVisibility(View.GONE);<br />layout2.setVisibility(View.VISIBLE);<br />layout3.setVisibility(View.GONE);<br />}<br />});</p><p>tv3.setOnClickListener(new View.OnClickListener() {</p><p>@Override<br />public void onClick(View v) {<br />layout1.setVisibility(View.GONE);<br />layout2.setVisibility(View.GONE);<br />layout3.setVisibility(View.VISIBLE);<br />}<br />});<br />}<br />} 

 

Demo程式中考慮將抽屜都放在上面，所以最後一個Layout的權重最高：android:layout_weight="0" ；

另外注意，Layout的android:layout_height屬性都必須是wrap_content 。 用fill_parent就沒戲啦！

 

如果有人想要講抽屜放在最下面，那麼局部檔案需要小改一下。 

1. 換一下TextView 和 Layout的位置

2. 講最上面的Layout的權重設為最高

 

Demo源碼上傳後會給出地址。

 

謝謝。 

 

 

 

 

 

-----------------------------------------------------------

本文來自CSDN     作者：feng88724

轉載請註明出處，如果對你有協助，請留言支援一下！