QMUI源码学习第一天

QMUIBottomSheet

官网:https://qmuiteam.com/android
GITHUB:https://github.com/QMUI/QMUI_Android

分为两个部分
1.BottomSheet List
2.BottomSheet Grid

显示点击后屏幕下方出现多个item

布局文件bottom_sheet_grid

  <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scrollbars="none"
        android:clipToPadding="false">

        <!-- 只有第一行时会在代码中去掉paddingBottom -->
        <LinearLayout
            android:id="@+id/bottom_sheet_first_linear_layout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:paddingLeft="?attr/qmui_bottom_sheet_grid_line_padding_horizontal"
            android:paddingRight="?attr/qmui_bottom_sheet_grid_line_padding_horizontal"
            android:paddingBottom="?attr/qmui_bottom_sheet_grid_line_vertical_space"
            android:orientation="horizontal"/>
    </HorizontalScrollView>

QMUIBottomSheetFragment.java

public class QDBottomSheetFragment extends BaseFragment {
   

    @BindView(R.id.topbar)
    QMUITopBarLayout mTopBar;
    @BindView(R.id.listview)
    ListView mListView;

    private QDItemDescription mQDItemDescription;

    @Override
    protected View onCreateView() {
   
        View view = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_listview, null);
        ButterKnife.bind(this, view);
        mQDItemDescription = QDDataManager.getInstance().getDescription(this.getClass());
        initTopBar();
        initListView();
        return view;
    }

    private void initTopBar() {
   
        mTopBar.addLeftBackImageButton().setOnClickListener(new View.OnClickListener() {
   
            @Override
            public void onClick(View v) {
   
                popBackStack();
            }
        });

        mTopBar.setTitle(mQDItemDescription.getName());
    }


    private void initListView() {
   
        String[] listItems = new String[]{
   
                "BottomSheet List",
                "BottomSheet Grid"
        };
        List<String> data = new ArrayList<>();

        Collections.addAll(data, listItems);

        mListView.setAdapter(new ArrayAdapter<>(getActivity(), R.layout.simple_list_item, data));
        mListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
   
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
   
                switch (position) {
   
                    case 0:
                        showSimpleBottomSheetList();
                        break;
                    case 1:
                        showSimpleBottomSheetGrid();
                        break;
                }
            }
        });
    }

    // ================================ 生成不同类型的BottomSheet
    private void showSimpleBottomSheetList() {
   
        new QMUIBottomSheet.BottomListSheetBuilder(getActivity())
                .addItem("Item 1")
                .addItem("Item 2")
                .addItem("Item 3")
                .setOnSheetItemClickListener(new QMUIBottomSheet.BottomListSheetBuilder.OnSheetItemClickListener() {
   
                    @Override
                    public void onClick(QMUIBottomSheet dialog, View itemView, int position, String tag) {
   
                        dialog.dismiss();
                        Toast.makeText(getActivity(), "Item " + (position + 1), Toast.LENGTH_SHORT).show();
                    }
                })
                .build()
                .show();
    }

    private void showSimpleBottomSheetGrid() {
   
        final int TAG_SHARE_WECHAT_FRIEND = 0;
        final int TAG_SHARE_WECHAT_MOMENT = 1;
        final int TAG_SHARE_WEIBO = 2;
        final int TAG_SHARE_CHAT = 3;
        final int TAG_SHARE_LOCAL = 4;
        QMUIBottomSheet.BottomGridSheetBuilder builder = new QMUIBottomSheet.BottomGridSheetBuilder(getActivity());
        builder.addItem(R.mipmap.icon_more_operation_share_friend, "分享到微信", TAG_SHARE_WECHAT_FRIEND, QMUIBottomSheet.BottomGridSheetBuilder.FIRST_LINE)
                .addItem(R.mipmap.icon_more_operation_share_moment, "分享到朋友圈", TAG_SHARE_WECHAT_MOMENT, QMUIBottomSheet.BottomGridSheetBuilder.FIRST_LINE)
                .addItem(R.mipmap.icon_more_operation_share_weibo, "分享到微博", TAG_SHARE_WEIBO, QMUIBottomSheet.BottomGridSheetBuilder.FIRST_LINE)
                .addItem(R.mipmap.icon_more_operation_share_chat, "分享到私信", TAG_SHARE_CHAT, QMUIBottomSheet.BottomGridSheetBuilder.FIRST_LINE)
                .addItem(R.mipmap.icon_more_operation_save, "保存到本地", TAG_SHARE_LOCAL, QMUIBottomSheet.BottomGridSheetBuilder.SECOND_LINE)
                .setOnSheetItemClickListener(new QMUIBottomSheet.BottomGridSheetBuilder.OnSheetItemClickListener() {
   
                    @Override
                    public void onClick(QMUIBottomSheet dialog, View itemView) {
   
                        dialog.dismiss();
                        int tag = (int) itemView.getTag();
                        switch (tag) {
   
                            case TAG_SHARE_WECHAT_FRIEND:
                                Toast.makeText(getActivity(), "分享到微信", Toast.LENGTH_SHORT).show();
                                break;
                            case TAG_SHARE_WECHAT_MOMENT:
                                Toast.makeText(getActivity(), "分享到朋友圈", Toast.LENGTH_SHORT).show();
                                break;
                            case TAG_SHARE_WEIBO:
                                Toast.makeText(getActivity(), "分享到微博", Toast.LENGTH_SHORT).show();
                                break;
                            case TAG_SHARE_CHAT:
                                Toast.makeText(getActivity(), "分享到私信", Toast.LENGTH_SHORT).show();
                                break;
                            case TAG_SHARE_LOCAL:
                                Toast.makeText(getActivity(), "保存到本地", Toast.LENGTH_SHORT).show();
                                break;
                        }
                    }
                }).build().show(); }}

HorizontalScrollView
1)HorizontalScrollView水平滚动控件使用方法
1、在layout布局文件的最外层建立一个HorizontalScrollView控件
2、在HorizontalScrollView控件中加入一个LinearLayout控件,并且把它的orientation设置为horizontal
3、在LinearLayout控件中放入多个装有图片的ImageView控件

android:scrollbars="none"与setVerticalScrollBarEnabled(true);的效果是一样的,不活动的时候隐藏,活动的时候也隐藏.
clipChildren是设置子view是否可以超出父view;
clipToPadding是设置是否可以在padding区域内绘制;
从裁剪的角度上讲:clipToPadding是剪裁到自己内边距处,如果clipToPadding为false,还是会剪裁到自己的边框处,而clipChildren是对child view完全不剪裁,只对自己的bg fg剪裁。

QMUIGroupListView

  private QDItemDescription mQDItemDescription;

    @Override
    protected View onCreateView() {
   
        View root = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_grouplistview, null);
        ButterKnife.bind(this, root);

        mQDItemDescription = QDDataManager.getInstance().getDescription(this.getClass());
        initTopBar();

        initGroupListView();

        return root;
    }

    private void initTopBar() {
   
        mTopBar.addLeftBackImageButton().setOnClickListener(new View.OnClickListener() {
   
            @Override
            public void onClick(View v) {
   
                popBackStack();
            }
        });

        mTopBar.setTitle(mQDItemDescription.getName());
    }

    private void initGroupListView() {
   
        QMUICommonListItemView normalItem = mGroupListView.createItemView(
                ContextCompat.getDrawable(getContext(), R.mipmap.about_logo),
                "Item 1",
                null,
                QMUICommonListItemView.HORIZONTAL,
                QMUICommonListItemView.ACCESSORY_TYPE_NONE);//不显示附属视图
        normalItem.setOrientation(QMUICommonListItemView.VERTICAL);

        QMUICommonListItemView itemWithDetail = mGroupListView.createItemView(
                ContextCompat.getDrawable(getContext(), R.mipmap.example_image0),
                "Item 2",
                null,
                QMUICommonListItemView.HORIZONTAL,
                QMUICommonListItemView.ACCESSORY_TYPE_NONE);
        itemWithDetail.setDetailText("在右方的详细信息");

        QMUICommonListItemView itemWithDetailBelow = mGroupListView.createItemView("Item 3");
        itemWithDetailBelow.setOrientation(QMUICommonListItemView.VERTICAL);
        itemWithDetailBelow.setDetailText("在标题下方的详细信息");

        QMUICommonListItemView itemWithChevron = mGroupListView.createItemView("Item 4");
        itemWithChevron.setAccessoryType(QMUICommonListItemView.ACCESSORY_TYPE_CHEVRON);//选中标记

        QMUICommonListItemView itemWithSwitch = mGroupListView.createItemView("Item 5");
        itemWithSwitch.setAccessoryType(QMUICommonListItemView.ACCESSORY_TYPE_SWITCH);
        itemWithSwitch.getSwitch().setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
   
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
   
                Toast.makeText(getActivity(), "checked = " + isChecked, Toast.LENGTH_SHORT).show();
            }
        });

        QMUICommonListItemView itemWithCustom = mGroupListView.createItemView("Item 6");
        itemWithCustom.setAccessoryType(QMUICommonListItemView.ACCESSORY_TYPE_CUSTOM);
        QMUILoadingView loadingView = new QMUILoadingView(getActivity());
        itemWithCustom.addAccessoryCustomView(loadingView);

        View.OnClickListener onClickListener = new View.OnClickListener() {
   
            @Override
            public void onClick(View v) {
   
                if (v instanceof QMUICommonListItemView) {
   
                    CharSequence text = ((QMUICommonListItemView) v).getText();
                    Toast.makeText(getActivity(), text + " is Clicked", Toast.LENGTH_SHORT).show();
                }
            }
        };

        int size = QMUIDisplayHelper.dp2px(getContext(), 20);
        QMUIGroupListView.newSection(getContext())
                .setTitle("Section 1: 默认提供的样式")
                .setDescription("Section 1 的描述")
                .setLeftIconSize(size, ViewGroup.LayoutParams.WRAP_CONTENT)
                .addItemView(normalItem, onClickListener)
                .addItemView(itemWithDetail, onClickListener)
                .addItemView(itemWithDetailBelow, onClickListener)
                .addItemView(itemWithChevron, onClickListener)
                .addItemView(itemWithSwitch, onClickListener)
                .addTo(mGroupListView);

        QMUIGroupListView.newSection(getContext())
                .setTitle("Section 2: 自定义右侧 View")
                .addItemView(itemWithCustom, onClickListener)
                .addTo(mGroupListView);
    }
}

QMUIGroupListSectionHeaderFooterView类基本功能:
1.该view继承至LinearLayout,也是一个线性布局。
2.在View视图里面只有一个TextView文本框。通过setText和getText方法来设置文本内容。
3.在使用时,由QMUIGroupListView创建一个Section,由Section通过调用setTitle和setDescription来动态创建一个*QMUIGroupListSectionHeaderFooterView 。new这个对象时,构造函数把值传递进去。
QMUIGroupListSectionHeaderFooterView的3种用法
1.调用QMUIGroupListView的newSection方法创建一个新的section后,再调用setTitle设置标题即可。如果不设置标题,则会默认留空白间距。

  QMUIGroupListView.newSection(getContext())
                .setTitle("Section 1: 默认提供的样式")
                .setDescription("Section 1 的描述")

在头部定义变量mGroupListContact

@BindView(R.id.group_list_item_contact)
    QMUIGroupListView mGroupListContact;
 QMUICommonListItemView listItemName = mGroupListContact.createItemView("平台名称");
   listItemName.setDetailText("CSDN");
   listItemName.setAccessoryType(QMUICommonListItemView.ACCESSORY_TYPE_CHEVRON);
   QMUIGroupListView.newSection(this)
                .setTitle
  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值