NativeScript WebビューまたはHTMLビューでのHTMLテーブルのレンダリング方法は？

Question

私のプロジェクトでは、オブジェクトの配列をテーブルとしてレンダリングする必要がありますが、GridViewを使用したくないのは、このコンポーネントをカスタマイズするのが非常に難しいためです。

HtmlViewまたはWebViewにHTMLテーブルをレンダリングするにはどうすればよいですか？

Answer 1

あなたは、ご希望のHTMLを構築し、このようHtmlViewかのWebViewに、後でそれを割り当てることができます。

<HtmlView html="your html" /> 
... 
<WebView src="your html" /> 

または使用してコード：

var htmlViewModule = require("ui/html-view") 
var htmlView = new htmlViewModule.HtmlView(); 
htmlView.html = "your html"; 
... 
var webViewModule = require("ui/web-view") 
var webView = new webViewModule.WebView(); 
webView.src= "your html"; 

あなたはしかしNativeScriptあなたのUI要素を配置する必要がある場合GridLayoutを使用する必要があります。 addChild()メソッドを使用して目的のUI要素を追加し、静的メソッドsetColumn()およびsetRow()を使用して目的の行/列を割り当てることができます。例：

var gridModule = require("ui/layouts/grid-layout"); 
var buttonModule = require("ui/button"); 

var grid = new gridModule.GridLayout(); 
grid.addColumn(new gridModule.ItemSpec(80, gridModule.GridUnitType.pixel)); 
grid.addColumn(new gridModule.ItemSpec(1, gridModule.GridUnitType.star)); 
grid.addRow(new gridModule.ItemSpec(1, gridModule.GridUnitType.auto)); 
grid.addRow(new gridModule.ItemSpec(1, gridModule.GridUnitType.auto)); 

var button new buttonModule.Button(); 
grid.addChild(button); 
gridModule.GridLayout.setRow(button, 1); 
gridModule.GridLayout.setColumn(button, 1); 
...