1. Toy模板网首页
  2. > Toy博客

Android之自定义时间选择弹框

9月前 作者：叶已初秋 分类：Toy博客 阅读(42) 违法举报

这篇具有很好参考价值的文章主要介绍了Android之自定义时间选择弹框。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

前言

随着产品人员不断变态下，总是会要求我们的界面高大上，随意UI能画出来我们就得搞出来才行，这里有自定义弹框，以及时间选择控件的运用，根据年和月判断当月有多少天，需要什么就copy什么。

一、效果图

Android之自定义时间选择弹框,Android自定义弹框,Android自定义时间选择,自定义时间弹框,NumberPicker的使用,NumberPicker颜色

二、实现步骤

1.自定义Dialog

代码如下（示例）：

package com.example.merchant.utils;

import android.app.Dialog;
import android.content.Context;
import android.content.DialogInterface;
import android.view.Gravity;
import android.view.KeyEvent;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.NumberPicker;
import android.widget.TextView;

import com.example.merchant.R;

import java.util.Calendar;


/**
 * Created by ：caoliulang
 * ❤
 * Creation time :2023/9/01
 * ❤
 * Function ：日期选择弹框
 */
public class TiemDialog extends Dialog {
    Context context;
    MenuListener mMenuListener;
    View mRootView;
    private Animation mShowAnim;
    private Animation mDismissAnim;
    private boolean isDismissing;
    TextView cancle;//取消
    TextView confirm;//确定
    NumberPicker number_month;//月
    NumberPicker number_day;//天
    NumberPicker number_yer;//年
    Calendar calendar = Calendar.getInstance();//取得当前时间的年月日 时分秒

    public TiemDialog(Context context) {
        super(context, R.style.ActionSheetDialog);
        this.context = context;
        getWindow().setGravity(Gravity.BOTTOM);
        initView(context);
    }

    private void initView(final Context context) {
        mRootView = View.inflate(context, R.layout.time_dialog, null);
        cancle = mRootView.findViewById(R.id.cancle);
        confirm = mRootView.findViewById(R.id.confirm);
        number_month = mRootView.findViewById(R.id.number_month);
        number_day = mRootView.findViewById(R.id.number_day);
        number_yer = mRootView.findViewById(R.id.number_yer);
        // 设置年份范围
        int curYear = Calendar.getInstance().get(Calendar.YEAR);
        number_yer.setMinValue(curYear - 10);
        number_yer.setMaxValue(curYear + 10);
        number_yer.setValue(calendar.get(Calendar.YEAR));

        // 设置月份范围
//        String[] months = new String[]{"1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"};
//        monthPicker.setDisplayedValues(months);
        number_month.setMinValue(1);
        number_month.setMaxValue(12);
        number_month.setValue(calendar.get(Calendar.MONTH) + 1);

        // 设置天数范围
//        String[] day = new String[]{"1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31"};
        int day = Calendar.getInstance().get(Calendar.HOUR_OF_DAY);
        number_day.setMinValue(1);
        number_day.setMaxValue(getDayTS(getYear(), getMonths()));
        number_day.setValue(calendar.get(Calendar.DAY_OF_MONTH));

        // 设置滚动监听器 年
        number_yer.setOnValueChangedListener(new NumberPicker.OnValueChangeListener() {
            @Override
            public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
                number_day.setMinValue(1);
                number_day.setMaxValue(getDayTS(getYear(), getMonths()));
            }
        });
        // 设置滚动监听器 月
        number_month.setOnValueChangedListener(new NumberPicker.OnValueChangeListener() {
            @Override
            public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
                number_day.setMinValue(1);
                number_day.setMaxValue(getDayTS(getYear(), getMonths()));
            }
        });
        // 设置滚动监听器 日
        number_day.setOnValueChangedListener(new NumberPicker.OnValueChangeListener() {
            @Override
            public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
            }
        });

        confirm.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mMenuListener.onSelect();
            }
        });
        cancle.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                cancel();
            }
        });

        this.setContentView(mRootView);
        initAnim(context);
        setOnCancelListener(new OnCancelListener() {
            @Override
            public void onCancel(DialogInterface dialog) {
                if (mMenuListener != null) {
                    mMenuListener.onCancel();
                }
            }
        });

    }

    private void initAnim(Context context) {
        mShowAnim = AnimationUtils.loadAnimation(context, R.anim.translate_up);
        mDismissAnim = AnimationUtils.loadAnimation(context, R.anim.translate_down);
        mDismissAnim.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                dismissMe();
            }

            @Override
            public void onAnimationRepeat(Animation animation) {

            }
        });
    }


    @Override
    public void show() {
        super.show();
        mRootView.startAnimation(mShowAnim);
    }

    @Override
    public void dismiss() {
        if (isDismissing) {
            return;
        }
        isDismissing = true;
        mRootView.startAnimation(mDismissAnim);
    }

    private void dismissMe() {
        super.dismiss();
        isDismissing = false;
    }

    public int getYear() {
        return number_yer.getValue();
    }

    public int getMonths() {
        return number_month.getValue();
    }

    public int getDay() {
        return number_day.getValue();
    }

    public MenuListener getMenuListener() {
        return mMenuListener;
    }

    public void setMenuListener(MenuListener menuListener) {
        mMenuListener = menuListener;
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_MENU) {
            dismiss();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }

    public interface MenuListener {
        void onCancel();

        void onSelect();
    }

    /**
     * 根据是否闰年和月份判断本月的天数
     *
     * @param year
     * @param month
     * @return
     */
    private int getDayTS(int year, int month) {
        int day = 30;
        boolean flag = false;
        switch (year % 4) {
            case 0:
                flag = true;
                break;
            default:
                flag = false;
                break;
        }
        switch (month) {
            case 1:
            case 3:
            case 5:
            case 7:
            case 8:
            case 10:
            case 12:
                day = 31;
                break;
            case 2:
                day = flag ? 29 : 28;
                break;
            default:
                day = 30;
                break;
        }
        return day;
    }
}

2.xml布局

代码如下（示例）：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">


    <LinearLayout
        android:id="@+id/ll_share"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:background="@drawable/bzhs_bff_8"
        android:gravity="center_horizontal"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="17dp"
            android:text="Seleccionar fecha"
            android:textColor="#232323"
            android:textSize="16dp"
            android:textStyle="bold" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="240dp"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:orientation="horizontal">

            <NumberPicker
                android:id="@+id/number_month"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:theme="@style/DefaultNumberPickerTheme"
                android:layout_weight="1" />

            <NumberPicker
                android:id="@+id/number_day"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:theme="@style/DefaultNumberPickerTheme"
                android:layout_weight="1" />

            <NumberPicker
                android:id="@+id/number_yer"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:theme="@style/DefaultNumberPickerTheme"
                android:layout_weight="1" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="40dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_marginBottom="46dp"
            android:gravity="center"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/cancle"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginRight="5dp"
                android:layout_weight="1"
                android:background="@drawable/bzhs_wls_4"
                android:gravity="center"
                android:text="Cancle"
                android:textColor="#333333"
                android:textSize="16dp" />

            <TextView
                android:id="@+id/confirm"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginLeft="5dp"
                android:layout_weight="1"
                android:background="@drawable/bzhs_qls_4"
                android:gravity="center"
                android:text="Confirm"
                android:textColor="#ffffff"
                android:textSize="16dp" />

        </LinearLayout>
    </LinearLayout>


</RelativeLayout>

3.背景白色转角drawable

代码如下（示例）：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 背景颜色 -->
    <solid android:color="#ffffff" />


    <!-- 控制圆角大小 -->
    <corners android:topRightRadius="8dp"
        android:topLeftRadius="8dp"/>

</shape>

4.取消按钮背景drawable

代码如下（示例）：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 背景颜色 -->
    <solid android:color="#ffffff" />

    <!-- 控制边界线颜色和大小 -->
    <stroke
        android:width="1dp"
        android:color="#006FF0" />

    <!-- 控制圆角大小 -->
    <corners android:radius="4dp" />

</shape>

5.确定按钮背景drawable

代码如下（示例）：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- 背景颜色 -->
    <solid android:color="#006FF0" />

    <!-- 控制边界线颜色和大小 -->
    <stroke
        android:width="1dp"
        android:color="#006FF0" />

    <!-- 控制圆角大小 -->
    <corners android:radius="4dp" />

</shape>

6.NumberPicker样式和弹框样式

代码如下（示例）：

  <style name="DefaultNumberPickerTheme" parent="AppTheme">
        <item name="colorControlNormal">@color/dividerColor</item>
    </style>

 <style name="ActionSheetDialog" parent="android:Theme.Dialog">
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowFrame">@null</item>
        <item name="android:windowBackground">#00000000</item>
        <item name="android:windowNoTitle">true</item>
    </style>

7.弹框动画

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
           android:fromYDelta="100%"
           android:toYDelta="0"
           android:duration="250">
</translate>

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
           android:fromYDelta="0%"
           android:toYDelta="100%"
           android:duration="250">
</translate>

8.Activity使用

//定义变量
private lateinit var timedialog: TiemDialog//日期选择弹框
//实例化
timedialog = TiemDialog(this)
//调用
showTimeDailog()
//方法
 /**
     * 日期弹框
     */
    private fun showTimeDailog() {
        val window: Window = timedialog.window!!
        val lp = window.attributes
        //这句就是设置dialog横向满屏了。
        lp.width = WindowManager.LayoutParams.MATCH_PARENT
        lp.height = WindowManager.LayoutParams.WRAP_CONTENT
        window.attributes = lp
        timedialog.show()
        timedialog.setCanceledOnTouchOutside(false)
        timedialog.menuListener = object : TiemDialog.MenuListener {
            //取消
            override fun onCancel() {
                timedialog.dismiss()
            }

            //确定
            override fun onSelect() {
                if (timedialog != null) {
                    text_time.text = "${timedialog.year}-${timedialog.months}-${timedialog.day}"
                    timedialog.dismiss()
                }
            }

        }
    }

总结

东西看起来多，也就两个模块，一个是自定义Dialog，一个NumberPicker的使用，欢迎随时探讨。文章来源地址https://www.toymoban.com/news/detail-688229.html

到了这里，关于Android之自定义时间选择弹框的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处： 如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：
领支付宝红包 赞助服务器费用

相关文章

  • Android开发之自定义控件-组合控件的开发与实现

    Android开发之自定义控件-组合控件的开发与实现

    最终实现的效果展示图：   类似支付宝微信，底部分隔线对齐标题效果：       完整渲染显示效果(包含三个条目右边不同颜色的文字)： 立体效果：  隐藏资产总额条目右边更多箭头  隐藏中国历史条目右边的文字： 隐藏中国历史条目下边的分隔线： 隐藏条目2中国历史左

    2024年02月10日
    浏览(41)
  • Android开发控件形状之自定义圆角button（三种形态）

    Android开发控件形状之自定义圆角button（三种形态）

    第一步：在drawable文件下创建button的形状描述文件btn_shape.xml btn1.xml btn2.xml btn3.xml 第二步：在布局文件中layout.xml中对btn1.xml以上三种其中一种的引用语句，用来设置button形状： android:background=\\\"@drawable/btn1\\\" 效果图： 点击前 点击后     解析shape文件中的android:shape属性：  Android

    2024年02月13日
    浏览(42)
  • 使用原生小程序组件Picker自定义日期时间选择器

    使用原生小程序组件Picker自定义日期时间选择器

    1、 Picker简单介绍 可以看到Picker类型有5种， 具体可以查看微信开放文档 picker。 Picker（选择器）是一种常见的用户界面控件，用于从多个选项中选择一个或多个选项。在小程序中，Picker 是一种可用于选择日期、时间、地点等信息的组件。 小程序中的 Picker 组件提供了几种不

    2024年02月09日
    浏览(45)
  • Android Material组件库(日期选择和时间选择器)基本使用

    Android Material组件库(日期选择和时间选择器)基本使用

    原文:Android Material组件库(日期选择和时间选择器)基本使用 - Stars-One的杂货小窝 简单的封装下Material组件里的日期选择器和时间选择器的使用方法 需要添加Material组件库的依赖(不过后面新版本Android Studio创建的新项目都会有此依赖了...)

    2024年02月05日
    浏览(66)

  • Vue宝典之自定义组件声明与使用

    Vue.js 是一款现代化的JavaScript框架，它的核心思想是组件化开发。通过使用Vue的自定义组件功能，我们可以将页面拆分为多个组件，每个组件负责自己的一部分功能。这样做的好处是，我们可以更好地管理和维护代码，使得项目结构更加清晰和可扩展。 自定义组件是Vue中用来

    2024年02月05日
    浏览(43)

  • Java 多线程之自定义线程池（ThreadPool）使用方法

    线程池是一种 管理和复用线程 的机制，它包含一组预先创建的线程，用于执行各种任务。线程池的主要作用是提高多线程应用程序的性能和效率，并提供对线程的生命周期和资源的管理，包括线程的创建、销毁和复用。 本文主要讨论线程池执行器（ThreadPoolExecutor）的用法，

    2024年04月26日
    浏览(38)
  • el-date-picker自定义选择时间&&el-time-select自定义选择时间实现避免时间冲突

    el-date-picker自定义选择时间&&el-time-select自定义选择时间实现避免时间冲突

    固定十二个月，当月开始时间默认选择月第一天，结束时间默认选择月最后一天； 月份选择只允许选择当前月份 将当月对应的每天按照时间段划分，段数不做限制。 时间段支持任意位置插入（新增）、删除。 每个时间段具有包含属性，同一时刻不允许在两个时间段中出现包

    2024年02月05日
    浏览(44)

  • 1. 使用Popup组件自定义弹框提示页面

    在QT中，经常使用QMessageBox进行弹框的提示，而在QML中并没有这个功能，但是可以利用Popup组件进行自定义弹框的设计。 该组件可以理解为是一个空白区域，默认的visible属性是false，即不显示，需要用户手动设置其为true，才能显示出来。或者使用其自带的open()和close()函数打开

    2024年02月07日
    浏览(49)
  • vue小程序，自定义时间选择器

    vue小程序，自定义时间选择器

    小程序已有的时间选择器与日期选择器无法支持自定义格式，需要使用多列选择器来定义 时间选择器仅支持 hh:mm 格式 日期选择器仅支持YYYY-MM-DD格式  因为项目要求的格式为 DD:hh:mm， 我找了好久，也没找到解决办法，决定自己使用多列选择器来实现该功能  range ：属性值为

    2024年02月10日
    浏览(26)
  • uniapp、小程序自定义选择日、周、月、季、年的时间选择器组件

    uniapp、小程序自定义选择日、周、月、季、年的时间选择器组件

    本组件用到了uni-ui的uni-popup弹窗组件 废话不多说直接上代码 https://ext.dcloud.net.cn/plugin?id=16387 https://ext.dcloud.net.cn/plugin?id=16387 属性参数说明 : ref用于控制picker的弹出与隐藏，组件内有open和close函数 参数名 作用 类型 默认值 type 控制打开piker时tabs默认显示的位置 String 月 time 显

    2024年03月14日
    浏览(38)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包，优惠每天领

二维码1

领取红包

二维码2

领红包