快捷導(dǎo)航

Android使用CardView實(shí)現(xiàn)圓角對(duì)話框

更新時(shí)間：2018年11月28日 17:26:38 作者：ruancw

這篇文章主要為大家詳細(xì)介紹了Android使用CardView實(shí)現(xiàn)圓角對(duì)話框，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

前言：隨著用戶(hù)體驗(yàn)的不斷的加深，良好的UI視覺(jué)效果也必不可少，以前方方正正的對(duì)話框樣式在APP已不復(fù)存在，取而代之的是帶有圓角效果的Dialog，之前設(shè)置對(duì)畫(huà)框的圓角效果都是通過(guò)drawable/shape屬性來(lái)完成，隨著Google API的不斷更新，API 21（Android 5.0）添加了新的控件CardView,這使得圓角的實(shí)現(xiàn)更加方便快捷。

效果圖：

導(dǎo)入CardView依賴(lài)（API 21新控件）

implementation 'com.android.support:cardview-v7:26.1.0'

1.布局引用

<android.support.v7.widget.CardView
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  app:cardCornerRadius="@dimen/dp_10">

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">
    <TextView
      android:id="@+id/tv_title"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:background="@color/colorTabClick"
      android:gravity="center"
      android:padding="@dimen/dp_10"
      android:text="溫馨提示:確定修改維護(hù)詳情信息？"
      android:textColor="@color/bg_mainWhite"
      android:textSize="@dimen/dp_16" />

    <View
      android:layout_width="match_parent"
      android:layout_height="1dp"
      android:background="@color/bg_line" />

    <TextView
      android:id="@+id/tv_des"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:padding="@dimen/dp_10"
      android:gravity="top"
      />

    <View
      android:layout_width="match_parent"
      android:layout_height="1dp"
      android:background="@color/bg_line" />

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

      <TextView
        android:id="@+id/tv_cancel"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1.0"
        android:gravity="center"
        android:text="取消"
        android:textSize="@dimen/dp_16" />

      <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="@color/bg_line" />

      <TextView
        android:id="@+id/tv_confirm"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1.0"
        android:gravity="center"
        android:text="確定"
        android:textSize="@dimen/dp_16" />
    </LinearLayout>
  </LinearLayout>

</android.support.v7.widget.CardView>

1.cardCornerRadius屬性：設(shè)置圓角的弧度大小，這里設(shè)置的為10dp

2.CardView還有padding、cardUseCompatPadding（內(nèi)邊距）、background等屬性

3.CardView繼承自FrameLayout,使用時(shí)可以重新嵌套布局

2.代碼實(shí)現(xiàn)

/**
 * 展示對(duì)話框
 */
private void showDialog(String title) {
  //初始化布局文件
  View dialogView = View.inflate(mContext, R.layout.dialog_layout_test, null);
  //標(biāo)題
  TextView tvTitle = (TextView) dialogView.findViewById(R.id.tv_title);
  //確定按鈕
  TextView tvConfirm = (TextView) dialogView.findViewById(R.id.tv_confirm);
  //取消按鈕
  TextView tvCancel = (TextView) dialogView.findViewById(R.id.tv_cancel);
  //描述信息
  TextView tvDes= (TextView) dialogView.findViewById(R.id.tv_des);
  //設(shè)置標(biāo)題及描述信息
  tvTitle.setText(title);
  tvDes.setText("退出當(dāng)前登錄后將要重新登錄！");
  //確定和取消按鈕監(jiān)聽(tīng)事件
  tvConfirm.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
      Intent intent = new Intent(mContext,LoginActivity.class);
      startActivity(intent);
      UIUtil.toast("退出成功，請(qǐng)重新登錄");
      getActivity().finish();
      mDialog.dismiss();
    }
  });
  tvCancel.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
      mDialog.dismiss();
    }
  });
  mMessageBuilder = new AlertDialog.Builder(mContext);
  mDialog = mMessageBuilder.create();
  //設(shè)置背景色為透明，解決設(shè)置圓角后有白色直角的問(wèn)題
  Window window=mDialog.getWindow();
  window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
  mDialog.setView(dialogView);
  mDialog.setCanceledOnTouchOutside(false);//點(diǎn)擊屏幕不消失
  mDialog.show();
  //設(shè)置參數(shù)必須在show之后，不然沒(méi)有效果
  WindowManager.LayoutParams params = mDialog.getWindow().getAttributes();
  mDialog.getWindow().setAttributes(params);
}

使用的是V7包的AlertDialog實(shí)現(xiàn)的，當(dāng)然也可以使用Dialog實(shí)現(xiàn)。

總結(jié)：CardView實(shí)現(xiàn)對(duì)話框的圓角效果更加的方便，不用編寫(xiě)shape屬性，當(dāng)標(biāo)題欄需要背景色時(shí)，也無(wú)需考慮設(shè)置標(biāo)題欄的shape（不使用CardView時(shí)，如果不使用shape設(shè)置背景色，會(huì)導(dǎo)致左上和右上不會(huì)變成圓角）。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: