在NativeScript中以编程方式添加内联样式

时间:2015-06-05 16:35:01

标签: javascript css nativescript

我正在教自己NativeScript的基础知识。

这是我的main-page.xml:

<Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded">
  <GridLayout id="grid">

  </GridLayout>
</Page>

这是JS代码:

var view = require("ui/core/view");
var layout = require("ui/layouts/grid-layout");

function pageLoaded(args) {
    var page = args.object;
    var gr = view.getViewById(page, "grid");
    if (gr) {
        for (var i = 0; i < 10; i++) {
            gr.addColumn(new layout.ItemSpec(1, layout.GridUnitType.star));
            var g = new layout.GridLayout();
            g.style = "{ background-color: red; }";
            layout.GridLayout.setColumn(g, i);
            gr.addChild(g);
        }
    }
}

exports.pageLoaded = pageLoaded;

如何以编程方式为代码隐藏中创建的网格设置样式?当我运行代码时,我看不到任何红色。理想情况下,我希望能够在不创建css类或通过id选择css的情况下添加样式。这是可能的,即添加内联样式吗?

编辑:修正了"{ backgroud-color: red; }";

中的拼写错误

1 个答案:

答案 0 :(得分:1)

您可以将背景设置为样式对象的属性:

g.style.backgroundColor = new colorModule.Color("Red");

检查&#34; JavaScript属性&#34;如果您需要访问样式对象的其他属性,则列here