Weex настроил собственный компонент Android для определения высоты текста - PullRequest
Новая
       14

Weex настроил собственный компонент Android для определения высоты текста

0 голосов
/ 04 мая 2018

Я создаю компонент представления Richtext (WXTextView.java) в Weex, расширяя WXComponent. Так как Richtext компонент недоступен в weex android sdk, тег v-html также не поддерживается в текстовом компоненте weex.

Когда мой элемент Richtext обернут внутри div, элемент не виден. Я должен вручную добавить высоту к родительскому элементу div, чтобы сделать его видимым. 

    <div class="parent">
      <textView
        ref="nativeTextView"
        :style="{
          color: '#ff6600',
          fontSize: '40px',
          maxLine: 2,
          borderWidth: 2,
          borderStyle: 'solid',
          borderColor: 'green',
        }"
        text="ABCDEF"
      />
    </div>

Предоставление высоты родителю не решает мою задачу, потому что длина текста является динамической. Я хочу сделать это так же, как текстовый компонент weex по умолчанию, поддерживающий форматированный текст.

WXTextView.java 

public class WXTextView extends WXComponent<TextView> {

private WXVContainer mContainer;
private int mHeight;

public WXTextView(WXSDKInstance instance, WXDomObject dom, WXVContainer parent) {
    super(instance, dom, parent);
    mContainer = parent;
}


@Override
protected TextView initComponentHostView(@NonNull Context context) {
    TextView textView = new TextView(context);
    setProperty(WXComponent.PROP_FIXED_SIZE, WXComponent.PROP_FS_WRAP_CONTENT);
    textView.setIncludeFontPadding(false);
    textView.setTextSize(WXText.sDEFAULT_SIZE);
    return textView;
}

@WXComponentProp(name = "text")
public void setText(String text) {
    getHostView().setText(Html.fromHtml(text));
    updateUI();
}

private void updateUI() {
    ViewGroup.LayoutParams params = mContainer.getRealView().getLayoutParams();
    params.height = getHeight();

    mContainer.getRealView().setLayoutParams(params);
    mContainer.getRealView().invalidate();
}

@WXComponentProp(name = "ellipsize")
public void setEllipsize(String positionString) {
    try {
        int position = Integer.parseInt(positionString);
        TextUtils.TruncateAt truncateType;
        switch (position) {
            case 0:
                truncateType = TextUtils.TruncateAt.START;
                break;
            case 1:
                truncateType = TextUtils.TruncateAt.MIDDLE;
                break;
            default:
                truncateType = TextUtils.TruncateAt.END;
                break;
        }
        getHostView().setEllipsize(truncateType);
        updateUI();
    } catch (Exception exception) {
        exception.printStackTrace();
    }
}

@WXComponentProp(name = "maxLine")
public void setMaxLine(String lineString) {
    try {
        int lineCount = Integer.parseInt(lineString);
        getHostView().setMaxLines(lineCount);
        updateUI();
    } catch (Exception exception) {
        exception.printStackTrace();
    }
}

@JSMethod
public void getElementSpecs(JSCallback callback){
    Log.d("nikhil", "android getHeight: " + getHostView().getHeight());
    Map<String, Object> data = new HashMap<>();
    data.put("width", getHostView().getMeasuredWidth());
    data.put("height", getHostView().getMeasuredHeight());
    data.put("positionX", getHostView().getX());
    data.put("positionY", getHostView().getY());
    callback.invoke(data);
}

@WXComponentProp(name = "color")
public void setColor(String color) {
    getHostView().setTextColor(Color.parseColor(color));
}

@WXComponentProp(name = "fontSize")
public void setFontSize(String sizeString) {
    int lastIndex = sizeString.indexOf("px");

    if (lastIndex == -1) {
        lastIndex = sizeString.length();
    }

    sizeString = sizeString.substring(0, lastIndex);

    int size = Integer.parseInt(sizeString);
    getHostView().setTextSize(size);
    updateUI();
}

public int getHeight() {
    getHostView().setText(getHostView().getText());
    getHostView().setTextSize(TypedValue.COMPLEX_UNIT_PX, getHostView().getTextSize());
    int widthMeasureSpec = View.MeasureSpec.makeMeasureSpec(mContainer.getRealView().getLayoutParams().width,
            View.MeasureSpec.AT_MOST);
    int heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
    getHostView().measure(widthMeasureSpec, heightMeasureSpec);
    mHeight = getHostView().getMeasuredHeight();
    return mHeight;
}

}

1 Ответ

0 голосов
/ 08 мая 2018

Текст - самый сложный компонент в Weex. Чтобы добиться такого же поведения, как текст weex, вам нужно расширить WXDomObject, так как текст расширяет WXTextDomObject, и реализовать собственную функцию измерения текста.

На самом деле, я написал richtext компонент в weex, который скоро будет выпущен.

...