为自定义相对布局视图中的每个文本视图设置不同的样式

时间:2018-04-30 07:32:24

标签: android view android-custom-view android-theme android-styles

我创建了一个包含多个子文本视图和图像视图的自定义视图。每个儿童视图都有自己的风格。但我正在努力以编程方式为这些子视图设置自定义样式。

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone">

<LinearLayout
    android:id="@+id/info_box_item"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical">


    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/info_box_item_title_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

        <TextView
            android:id="@+id/info_box_item_title"
            style="@style/InfoBoxTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:gravity="center_vertical"
            android:maxLines="1"
            android:maxWidth="150dp" />

    </LinearLayout>

    <TextView
        android:id="@+id/info_box_item_description"
        style="@style/InfoBoxDescription"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ellipsize="end"
        android:gravity="center_vertical"
        android:maxLines="1"
        android:maxWidth="150dp"
        android:visibility="gone" />

    <TextView
        android:id="@+id/info_box_item_extra_detail"
        style="@style/InfoBoxExtraDetail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ellipsize="end"
        android:gravity="center_vertical"
        android:maxLines="1"
        android:maxWidth="150dp"
        android:visibility="gone" />
</LinearLayout>

<ImageView
    android:id="@+id/arrow"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_marginLeft="@dimen/margin_base"
    android:layout_toEndOf="@id/info_box_item"
    android:layout_toRightOf="@id/info_box_item"
    android:src="@drawable/ic_chevron_right"
    android:tint="@color/white"
    android:visibility="gone" />
</RelativeLayout>

在这里,我创建了三种样式InfoBoxTitleInfoBoxDescriptionInfoBoxExtraDetail

public class InfoBoxItemView extends LinearLayout {
RelativeLayout parent;
TextView title, description, moreDetail;
Context mContext;
ImageView arrow, titleIcon;
InfoBoxItemModel infoBoxItemModel;
int titleDrawableTop;

String titleText, descriptionText, moreDetailText;

public InfoBoxItemView(Context context) {
    this(context, null);
}

public InfoBoxItemView(Context context, @Nullable AttributeSet attrs) {
    this(context, attrs, 0);
}

public InfoBoxItemView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    mContext = context;
    LayoutInflater.from(mContext).inflate(R.layout.info_box_item, this, true);
    initAttributes(context, attrs,defStyleAttr);
    init();
}

private void initAttributes(Context context, AttributeSet attrs, int defStyleAttr) {
    final TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.InfoBoxItemView,
            defStyleAttr,0);
    titleText = typedArray.getString(R.styleable.InfoBoxItemView_title);
    descriptionText = typedArray.getString(R.styleable.InfoBoxItemView_description);
    titleDrawableTop = typedArray.getResourceId(R.styleable.InfoBoxItemView_titleDrawableTop, 0);
    moreDetailText = typedArray.getString(R.styleable.InfoBoxItemView_moreDetail);
    typedArray.recycle();
}

private void init() {
    parent = findViewById(R.id.parent);
    title = findViewById(R.id.info_box_item_title);
    titleIcon = findViewById(R.id.info_box_item_title_icon);
    description = findViewById(R.id.info_box_item_description);
    moreDetail = findViewById(R.id.info_box_item_extra_detail);
    arrow = findViewById(R.id.arrow);
    if (!HTTextUtils.isEmpty(titleText))
        setTitle(titleText);
    if (!HTTextUtils.isEmpty(descriptionText))
        setDescription(descriptionText);
    if (!HTTextUtils.isEmpty(moreDetailText))
        setMoreDetail(moreDetailText);
    setTitleDrawableTop(titleDrawableTop);
}

public InfoBoxItemView setInfoBoxItemModel(InfoBoxItemModel infoBoxItemModel) {
    this.infoBoxItemModel = infoBoxItemModel;
    setTitle(infoBoxItemModel.getTitle());

    if (!HTTextUtils.isEmpty(infoBoxItemModel.getDescription())) {
        setDescription(infoBoxItemModel.getDescription());
        description.setVisibility(VISIBLE);
    }

    if (!HTTextUtils.isEmpty(infoBoxItemModel.getMoreDetail())) {
        setMoreDetail(infoBoxItemModel.getMoreDetail());
        showExtraDetail(true);
    }

    if (!HTTextUtils.isEmpty(infoBoxItemModel.getResourceName())) {
        int resource = Utils.getDrawableResource(mContext, infoBoxItemModel.getResourceName());
        setTitleDrawableTop(resource);
    }

    parent.setVisibility(VISIBLE);
    return this;
}

public void setTitleDrawableTop(@DrawableRes int resource) {
    if (resource == 0) {
        return;
    }
    titleIcon.setImageResource(resource);
}

public void showArrow() {
    arrow.setVisibility(View.VISIBLE);
}

public void hideArrow() {
    arrow.setVisibility(INVISIBLE);
}

public void setTitle(String title) {
    this.title.setText(title);
}

public void setDescription(String description) {
    this.description.setText(description);
}

public void setMoreDetail(String moreDetail) {
    this.moreDetail.setText(moreDetail);
}

public void showExtraDetail(boolean show) {
    if (moreDetail == null)
        return;
    if (show)
        moreDetail.setVisibility(VISIBLE);
    else
        moreDetail.setVisibility(GONE);
}

public boolean isExtraDetailVisible() {
    if (moreDetail != null)
        return moreDetail.getVisibility() == VISIBLE;
    else return false;
}
}

现在,如果有人动态创建并初始化InfoBoxItemView,那么他将如何动态地自定义这三个子文本视图(title,description,moreDetail)。

1 个答案:

答案 0 :(得分:0)

为每一个制作Getter和Setter

例如我有这个自定义视图

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<p id="base_price">200</p>
<input type="hidden" name="discount" value= '15' id="discount">
<input type="checkbox" name="discCheck" id= "discCheck">
<script>
$(document).ready(function() {
    var base_price = $('#base_price').text();

    $( '#discCheck' ).click(function(){ 
          if( $('#discCheck' ).is(':checked')){
                var discVal = $('#discount').val();
                var calDiscount = base_price -(base_price *15/100);
                 $('#base_price').text(calDiscount);
          } else { $('#base_price').text(base_price); };
        }); 
    });
</script>
</body>
</html>

init 功能

public class ChartLineView extends FrameLayout {
    LineChart canvas;
    TextView box;
    TextView viewTitle;
}

然后设置Setter和Getter

 box = (TextView) findViewById(R.id.box);
 viewTitle = (TextView) findViewById(R.id.title_chart);

现在我可以控制它们了

 public LineChart getCanvas() {
        return canvas;
    }

    public void setCanvas(LineChart canvas) {
        this.canvas = canvas;
    }

    public TextView getBox() {
        return box;
    }

    public void setBox(TextView box) {
        this.box = box;
    }