Android UI組件進階(2)——仿Windows對話方塊,androidui

來源:互聯網
上載者:User

Android UI組件進階(2)——仿Windows對話方塊,androidui

Android UI組件進階(2)——仿Windows對話方塊


在開始本章前先祝大家中秋節快樂哈,相信很多上班的朋友都是放三天假的哈!

有時間的話回家陪陪父母吧!樹欲靜而風不止,子欲養而親不待!歲月不饒人!

好了,道理和祝福語就說到這裡了,今天給大家準備的是模仿Windows風格對話方塊!


:

相信大部分的AlertDialog都是下面這個樣子的:



今天給大家講解的對話方塊是下面這樣的:



對比兩種對話方塊,站在使用者的角度,相信你更加鐘情於第二種顏色鮮明的對話方塊

好了下面就開始講解如何製作模仿windows風格的對話方塊吧!




代碼的邏輯流程:

其實就是自訂對話方塊的布局,然後載入以及完成相應的事件處理而已!




核心代碼解析:

①按鈕點擊效果:btnexit_selctor.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android" >    <item android:state_pressed="false" android:drawable="@drawable/btnexit"/><item android:state_pressed="true" android:drawable="@drawable/btnexit_s"/></selector>



②對話方塊的布局檔案:dialog_win.xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@+id/RelativeLayout1"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <RelativeLayout        android:id="@+id/titlelayout"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_alignParentLeft="true"        android:layout_alignParentTop="true"        android:background="#53CC66"        android:padding="5dp" >        <TextView            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:text="提示資訊"            android:textColor="#ffffff"            android:textSize="15sp" />        <ImageButton            android:id="@+id/btncancle"         android:layout_width="30dp"        android:layout_height="30dp"        android:background="@drawable/btnexit_selctor"        android:layout_alignParentRight="true"            />            </RelativeLayout>           <LinearLayout        android:id="@+id/detaillayout"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentLeft="true"        android:layout_below="@+id/titlelayout"        android:layout_marginLeft="30dp"        android:layout_marginTop="22dp"        android:orientation="vertical" >        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="10dp"            android:layout_marginTop="10dp"            android:text="仿Windows對話方塊Demo"            android:textColor="#04AEDA"            android:textSize="18sp" />        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_marginLeft="10dp"            android:layout_marginTop="10dp"            android:text="作者:Coder-pig"            android:textColor="#04AEDA"            android:textSize="18sp" />    </LinearLayout>         <LinearLayout        android:layout_marginTop="30dp"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal"        android:layout_below="@+id/detaillayout"    >             <Button         android:id="@+id/btnblog"        android:layout_width="match_parent"        android:layout_height="40dp"        android:background="@drawable/btnpress_selctor"        android:text="訪問部落格"        android:layout_margin="5dp"            android:layout_weight="1"            android:textColor="#ffffff"            android:textSize="20sp"        />           <Button            android:id="@+id/btnclose"         android:layout_width="match_parent"        android:layout_height="40dp"        android:background="@drawable/btnpress_selctor"        android:text="關閉"        android:layout_margin="5dp"            android:layout_weight="1"             android:textColor="#ffffff"            android:textSize="20sp"       />            </LinearLayout>    </RelativeLayout>



③MainActivity.java

package com.jay.example.windowsdialogdemo;import android.app.Activity;import android.app.AlertDialog;import android.app.AlertDialog.Builder;import android.content.Context;import android.content.Intent;import android.net.Uri;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.View.OnClickListener;import android.widget.Button;import android.widget.ImageButton;import android.widget.Toast;public class MainActivity extends Activity {private Button btnshow;private View dialogView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);btnshow = (Button) findViewById(R.id.btnshow);btnshow.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {Builder builder = myBuilder(MainActivity.this);final AlertDialog dialog = builder.show();//設定點擊螢幕外側,對話方塊不消失,不設定的話點外面對話方塊就會消失dialog.setCanceledOnTouchOutside(false);//接著要監聽對話方塊中的三個按鈕://①關閉對話方塊的按鈕:ImageButton imgcancle = (ImageButton) dialogView.findViewById(R.id.btncancle);imgcancle.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {dialog.dismiss();}});//①連結到部落格的按鈕Button btnblob = (Button) dialogView.findViewById(R.id.btnblog);btnblob.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {Toast.makeText(getApplicationContext(), "訪問部落格", Toast.LENGTH_SHORT).show();Uri uri = Uri.parse("http://blog.csdn.net/coder_pig");Intent intent = new Intent(Intent.ACTION_VIEW, uri);startActivity(intent);dialog.dismiss();}});//③點擊退出的按鈕:Button btnclose = (Button) dialogView.findViewById(R.id.btnclose);btnclose.setOnClickListener(new OnClickListener() {public void onClick(View v) {dialog.dismiss();}});}//定義一個返回Builder對象的方法,其實這裡是設定對話方塊顯示view內容的方法private Builder myBuilder(Context context) {final LayoutInflater inflater = MainActivity.this.getLayoutInflater();AlertDialog.Builder builder = new AlertDialog.Builder(context);dialogView = inflater.inflate(R.layout.dialog_win, null);return builder.setView(dialogView);}});}}



執行個體代碼下載:

http://pan.baidu.com/s/1jGone5o
















我下了你的android-22_r01-windows可是點擊的時出現如下對話方塊怎辦

這,我也沒試過。。不過你裝了java沒?
 
安卓(Android)這樣的UI組件是怎實現的,有沒有視頻教程或者實現的文檔執行個體也可以

不是什麼都要用ListView的,這裡完全沒必要。

ListView是用在 每個Item樣式相同,並且Item的數量不固定,需要動態讀取的

這種頁面就是相對靜態頁面,item是固定的,直接用LinearLayout 做了,每一個欄目都是一個LinearLayout,裡面嵌套左側ImageView ,中間兩個TextView,右側一個箭號。
背景圖片依次設定就行了
 

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.