管道和ea号之间的下划线

时间:2017-03-01 19:23:57

标签: css xml sapui5

所以我有一个数字可以说19356我希望它看起来像1 | 9 | 3 | 5 | 6并且它也都有下划线。这可能不会破坏数字并添加管道和下划线吗?此外,它不必是一个管道,因此只是数字之间的一条线。

1 个答案:

答案 0 :(得分:0)

我有解决方案你的问题。您可以通过扩展 sap.m.FormattedText 并按照以下方式处理功能来实现它。

我将创建两个名为 SpecialFormattedText SpecialFormattedTextRenderer 的文件,如下所示。

这是第一个扩展FormattedText的类,并且有一个int类型的属性 number ,因为你想使用数字所以我选择了int数据类型。

sap.ui.define(["sap/m/FormattedText"], function (FormattedText) {
    "use strict";
    return FormattedText.extend("SpecialFormattedText", {
        metadata : {
            properties : {
                 number : {
                     type : "int", defaultValue : null
                 }
            }
        },
        setNumber : function(iMumber) {
            this.setProperty("number", iMumber, true);
            this.setProperty("htmlText", this._getUpdatedNumber(iMumber), true);
        },
        _getUpdatedNumber : function(iMumber) {
            return "<U>"+iMumber.toString().match(/.{1}/g).join('|')+"</U>";
        }
    });
});

在这里,我将根据需要转换输入并设置为 FormattedText htmlText ,并将原始值保持在数字。您可以使用 SpecialFormattedText 类对象提供的 getNumber 方法获取原始值。

接下来重要的是我们在其他名为 SpecialFormattedTextRenderer 的类中编写渲染器。在这个类中,我们将调用sap.m.FormattedTextRenderer类渲染器方法,如下所示。

sap.ui.define(["sap/m/FormattedTextRenderer"], function (FormattedTextRenderer) {
    "use strict";
    var SpecialFormattedTextRenderer = {};
    SpecialFormattedTextRenderer.render = function (oRM, oControl) {
        oRM.write("<div");
        FormattedTextRenderer.render(oRM, oControl);
        oRM.write("</div>");
    };
    return SpecialFormattedTextRenderer;
},true);