自定义RelativeLayout view实现布局。



在开发中,一个界面或者几个界面通常用到的基本UI都是相似的。这时候如果布局文件的话 往往会涉及到多个布局文件。我们更倾向于自定义的view。

UI:

public class WFFE_FilePickerView2  extends RelativeLayout implements WFIFormElementActivityResult{
    private TextView mTxtTitle;
    private ImageView mImgIcon;
    private TextView mTxtValue;
    private ImageView mImgArrow;
    private WFFE_FilePicker2 element;

    private static final int ID_TITLE_LABEL  = 0x1001;
    private static final int ID_RIGHT_ARROW  = 0x1002;
    private static final int ID_MIDDEL_IMG   = 0x1003;
    private static final int ID_VALUE_TXT    = 0x1004;

    public WFFE_FilePickerView2(Context context, WFFE_FilePicker2 filePicker) {
        super(context);
        this.element = filePicker;
        this.initAttributes();
    }


    public WFFE_FilePickerView2(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @SuppressWarnings("ResourceType")
    private void initAttributes() {
        if (null == getContext() || null == element) {
            return;
        }

        final int imgWidth = GlobalUtil.getPixelsByDp(getContext(), 20.0F);

        //
        // initializes this ViewGroup and all child views
        //
        LinearLayout.LayoutParams viewGroupLayoutParams = new LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.WRAP_CONTENT);

        ViewUtils.setMarginParams(
                this.getContext(),
                viewGroupLayoutParams,
                true,
                WFIFormElement.MARGIN_12DP,
                WFIFormElement.MARGIN_5DP,
                WFIFormElement.MARGIN_12DP,
                WFIFormElement.MARGIN_5DP);

        this.setLayoutParams(viewGroupLayoutParams);
        this.setGravity(Gravity.CENTER_VERTICAL);

        mImgArrow = new ImageView(getContext());
        mImgArrow.setId(ID_RIGHT_ARROW);
        mImgArrow.setImageResource(R.drawable.icon_right_arrow);
        LayoutParams arrowParams = new LayoutParams(imgWidth, imgWidth);
        arrowParams.addRule(ALIGN_PARENT_RIGHT);
        arrowParams.addRule(CENTER_VERTICAL);
        ViewUtils.setMarginParams(getContext(), arrowParams, true, WFIFormElement.MARGIN_5DP, 0, 0, 0);

        mTxtTitle = new TextView(getContext());
        mTxtTitle.setId(ID_TITLE_LABEL);
        mTxtTitle.setTextSize(WFIFormElement.TEXT_SIZE_15SP);
        LayoutParams titleParam = new LayoutParams(LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        titleParam.addRule(ALIGN_PARENT_LEFT);
        CharSequence titleText = GlobalUtil.appendHeadAsterisk(getContext(), element.isRequired(), element.label, Constants.GREEN);
        mTxtTitle.setText(titleText);

        mTxtValue = new TextView(getContext());
        mTxtValue.setId(ID_VALUE_TXT);
        LayoutParams valueParam = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        valueParam.addRule(LEFT_OF, mImgArrow.getId());
        mTxtValue.setGravity(Gravity.RIGHT);
        mTxtValue.setVisibility(GONE);

        mImgIcon = new ImageView(getContext());
        mImgIcon.setId(ID_MIDDEL_IMG);
        LayoutParams iconParam = new LayoutParams(imgWidth, imgWidth);
        iconParam.addRule(LEFT_OF, mTxtValue.getId());
        mImgIcon.setImageResource(R.drawable.icon_right_arrow);
        ViewUtils.setMarginParams(getContext(), iconParam, true, WFIFormElement.MARGIN_5DP, 0, WFIFormElement.MARGIN_5DP, 0);
        mImgIcon.setVisibility(GONE);

        View lineView = new View(getContext());
        lineView.setBackgroundColor(Constants.GREEN);
        LayoutParams lineParam = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, 1);
        lineParam.setMargins(WFIFormElement.MARGIN_5DP, WFIFormElement.MARGIN_5DP,
                WFIFormElement.MARGIN_5DP, WFIFormElement.MARGIN_5DP);
        lineParam.addRule(BELOW, mTxtTitle.getId());

        this.addView(mTxtTitle, titleParam);
        this.addView(mImgIcon, iconParam);
        this.addView(mTxtValue, valueParam);
        this.addView(mImgArrow, arrowParams);
        this.addView(lineView, lineParam);
        setupListener();
    }

    private void setupListener() {
        if (null != mImgArrow && mImgArrow.getVisibility() == VISIBLE) {
            mImgArrow.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    intentToFilePickerPage();
                }
            });
        }
    }

    private void intentToFilePickerPage() {
        Intent intent = new Intent(getContext(), BM_ContentChooserActivity.class);
        intent.putExtra(BM_ContentChooserFragment.FILE_TYPE, BM_ContentChooserFragment.TypeFlag.FORM);
        intent.putExtra(BM_ContentChooserFragment.CONTENT_SELECTED_ONE, true);
        ((Activity) getContext()).startActivityForResult(intent, 1001);
    }

    @Override
    public void handleActivityResult(int requestCode, int resultCode, Intent data) {
        if (element.showIcon) {
            this.mImgIcon.setVisibility(VISIBLE);
        }
        FileRecord fileRecord = (FileRecord) data.getSerializableExtra(BM_ContentChooserFragment.SELECTED_FILERECORD);
        if (element.showValue) {
            this.mTxtValue.setVisibility(VISIBLE);
            this.mTxtValue.setText(fileRecord.name);
        }
    }
}
开发中我们的习惯是(至少我的习惯是):定义一个view 比如说 label  img text img。习惯是从左往右按顺序定义。这样的话 有时候很多UI不能实现。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值