androids实现从底部弹出列表选择框

使用BottomSheet和listView组合完成

private void showSelectorDialog() {
        // 创建 BottomSheetDialog 对象

        final BottomSheetDialog bottomSheetDialog = new BottomSheetDialog(this);

        // 获取底部列表的布局
        View bottomSheetView = getLayoutInflater().inflate(R.layout.bottom_sheet_layout, null);

        // 设置底部列表的布局
        bottomSheetDialog.setContentView(bottomSheetView);
        //点击弹框外部,弹框不消失
        bottomSheetDialog.setCanceledOnTouchOutside(false);

        // 获取ListView
        ListView listView = bottomSheetView.findViewById(R.id.list_view);

        // 创建适配器
        CustomAdapter adapter = new CustomAdapter(this,YourList);

        // 设置适配器
        listView.setAdapter(adapter);

        // 处理列表项的点击事件
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                // 处理列表项的点击事件
               XXX
                bottomSheetDialog.dismiss(); // 点击后关闭底部列表
            }
        });

        // 显示底部列表
        bottomSheetDialog.show();

        // 取消
        TextView cancel = bottomSheetView.findViewById(R.id.tv_cancel);
        cancel.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
				//处理取消事件
                bottomSheetDialog.dismiss();
                
            }
        });
    }

创建列表项的适配器CustomAdapter

public class CustomAdapter extends ArrayAdapter<SignServerInfo> {

    private List<SignServerInfo> objects;

    public CustomAdapter(Context context, List<SignServerInfo> objects) {
        super(context, 0, objects);
        this.objects = objects;
    }

    @NonNull
    @Override
    public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {
        if (convertView == null) {
            convertView = LayoutInflater.from(getContext()).inflate(R.layout.list_item_layout, parent, false);
        }

        // 获取当前位置的对象
        SignServerInfo item = objects.get(position);

        // 在布局中找到需要显示数据的视图,并设置对应的数据
        TextView textView = convertView.findViewById(R.id.list_text_view);
        textView.setText(item.getProjectName());

        // 可以继续设置其他视图的数据

        return convertView;
    }

列表布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <ListView
        android:id="@+id/list_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <View
        android:layout_width="match_parent"
        android:layout_height="5dp"
        android:background="@color/line" />

    <TextView
        android:id="@+id/tv_cancel"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:paddingBottom="12dp"
        android:paddingTop="12dp"
        android:gravity="center"
        android:text="取消"
        android:textColor="#999999"
        android:textSize="14sp" />

</LinearLayout>

列表项布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_item_layout"
    android:gravity="center"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:gravity="center"
        android:id="@+id/list_text_view"
        android:layout_width="match_parent"
        android:layout_height="@dimen/public_space_value_45">

    </TextView>
</LinearLayout>
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在微信小程序,可以通过自定义一个底部弹出选择实现带有取消和确定按钮的功能。 首先,创建一个wxml文件,命名为"bottom_dialog.wxml"。在该文件,可以使用`<view>`标签来实现底部弹出选择的整体布局。例如: ```xml <!-- bottom_dialog.wxml --> <view class="dialog-container"> <!-- 选择内容 --> <view class="dialog-content"> <!-- 添加选择项 --> <view class="option-item">选项1</view> <view class="option-item">选项2</view> <view class="option-item">选项3</view> </view> <!-- 底部按钮 --> <view class="dialog-footer"> <view class="cancel-btn">取消</view> <view class="confirm-btn">确定</view> </view> </view> ``` 接下来,在对应的wxss文件(如"bottom_dialog.wxss")底部弹出选择进行样式设置,例如: ```css /* bottom_dialog.wxss */ .dialog-container { position: fixed; left: 0; bottom: 0; width: 100%; background-color: #fff; } .dialog-content { padding: 10px; } .option-item { padding: 10px 0; border-bottom: 1px solid #eee; text-align: center; } .dialog-footer { display: flex; justify-content: space-between; padding: 10px; } .cancel-btn, .confirm-btn { width: 100px; padding: 6px 0; text-align: center; background-color: #eee; } .confirm-btn { background-color: #007aff; color: #fff; } ``` 最后,在业务逻辑的js文件使用`wx.showModal`方法来控制底部弹出选择的显示与隐藏。例如: ```javascript // dialog.js Page({ showModal() { wx.showModal({ title: '底部选择', content: '', showCancel: false, cancelText: '取消', confirmText: '确定', success(res) { if (res.confirm) { // 用户点击确定按钮的逻辑处理 console.log('用户点击确定'); } else if (res.cancel) { // 用户点击取消按钮的逻辑处理 console.log('用户点击取消'); } } }) } }) ``` 通过上述步骤,就可以在小程序实现带有取消和确定按钮的底部弹出选择

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值