时间日期选择器

主Activity,DatePicker宇TimePicker,实际开发中一般都用对话框,当我们点击按钮时会new出一个对话框,并设置好上下文,监听器和时间,TimePicker中最后一个参数为是否采用24小时制。当点击对话框的ok时会触发相应的监听器,执行对应的方法。
public class MainActivity extends AppCompatActivity implements View.OnClickListener,DatePickerDialog.OnDateSetListener,TimePickerDialog.OnTimeSetListener{
    private TextView tv,tv2;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        tv=(TextView) findViewById(R.id.date);
        findViewById(R.id.bt).setOnClickListener(this);
        tv2=(TextView)findViewById(R.id.time);
        findViewById(R.id.bt2).setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        if(v.getId()==R.id.bt)
        {
           Calendar calendar=Calendar.getInstance();
            DatePickerDialog dialog=new DatePickerDialog(this,this,calendar.get(Calendar.YEAR),calendar.get(Calendar.MONTH),calendar.get(Calendar.DAY_OF_MONTH));
            dialog.show();
        }
        else if(v.getId()==R.id.bt2)
        {
            Calendar calendar=Calendar.getInstance();
            TimePickerDialog dialog=new TimePickerDialog(this,this,calendar.get(Calendar.HOUR_OF_DAY),calendar.get(Calendar.MINUTE),true);
            dialog.show();
        }
    }

    @Override
    public void onDateSet(DatePicker view, int year, int month, int dayOfMonth) {
        String result=String.format("你选择的日期是%d年%d月%d日",year,month+1,dayOfMonth);
        tv.setText(result);

    }

    @Override
    public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
        String result=String.format("你选择的时间是%d时%d分",hourOfDay,minute);
        tv2.setText(result);

    }

}
主布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.ljb.jibenkongjian.MainActivity"
    android:orientation="vertical"
    >
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/date"
        />
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/bt"
        android:text="日期"
        />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/time"
        />
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/bt2"
        android:text="时间"
        />
</LinearLayout>
   
   
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Vue3移动端中添加时间日期选择器可以通过以下步骤进行操作: 1. 首先,在项目中安装合适的第三方工具库。在Vue3中,推荐使用antd-mobile作为UI组件库,它提供了丰富的移动端组件,包括时间日期选择器。你可以通过npm或yarn安装antd-mobile。 2. 创建一个新的组件,用于包含时间日期选择器。在该组件的template中,使用antd-mobile的日期选择器组件来实现时间日期的选择。例如: ``` <template> <div> <a-picker :value="date" :mode="'datetime'" :extra="'请选择日期时间'" :format="'YYYY-MM-DD HH:mm'" @change="handleDateChange" > <a-list-item slot="extra" arrow="horizontal">{{ date }}</a-list-item> </a-picker> </div> </template> ``` 3. 在该组件的script部分,需要定义date数据属性,并在methods中实现handleDateChange方法,用于处理选择器的值变化。例如: ``` <script> import { ref } from 'vue'; export default { setup() { const date = ref(''); const handleDateChange = (value) => { date.value = value; }; return { date, handleDateChange }; }, }; </script> ``` 4. 在需要使用时间日期选择器的页面中,引入该组件并将其放置在合适的位置。 通过以上步骤,你就可以在Vue3移动端中成功添加时间日期选择器了。当用户选择了日期时间后,你可以在handleDateChange方法中对选择的值进行处理,例如保存到数据库或向后端发送请求。记得根据实际需要设置合适的日期时间格式、选择器模式和额外的提示文字。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值