.Net语言Smobiler开发之如何在手机上实现表单设计

最前面的话：smobiler是一个在vs环境中使用.net语言来开发app的开发平台，也许比xamarin更方便

一、目标样式

我们要实现上图中的效果，需要如下的操作：

1.从工具栏上的”smobiler components”拖动一个一个tableview控件到窗体界面上

2.修改gridview控件的属性

a.load事件代码

vb：

 private sub testtableview_load(sender as object, e as eventargs)handles mybase.load
 dim mattable as new datatable
 mattable.columns.add("mat_desc1", gettype(string))
 mattable.columns.add("mat_desc2", gettype(string))
 mattable.columns.add("mat_desc3", gettype(string))
 mattable.columns.add("mat_desc4", gettype(string))
 mattable.rows.add()
 mattable.rows(0)("mat_desc1") = "201503"
 mattable.rows(0)("mat_desc2") = "mz"
 mattable.rows(0)("mat_desc3") = "0"
 mattable.rows(0)("mat_desc4") = "17"
 mattable.rows.add()
 mattable.rows(1)("mat_desc1") = "201504"
 mattable.rows(1)("mat_desc2") = "mz"
 mattable.rows(1)("mat_desc3") = "0"
 mattable.rows(1)("mat_desc4") = "17"
 mattable.rows.add()
 mattable.rows(2)("mat_desc1") = "201505"
 mattable.rows(2)("mat_desc2") = "mz"
 mattable.rows(2)("mat_desc3") = "0"
 mattable.rows(2)("mat_desc4") = "17"
 mattable.rows.add()
 mattable.rows(3)("mat_desc1") = "201506"
 mattable.rows(3)("mat_desc2") = "mz"
 mattable.rows(3)("mat_desc3") = "0"
 mattable.rows(3)("mat_desc4") = "17" 
 me.tableview1..datasource = mattable
 me.tableview1.databind()
 
 end sub c#：
 private void testtableview_load(object sender, eventargs e)
 {
 datatable mattable = new datatable();
 mattable.columns.add("mat_desc1", typeof(string));
 mattable.columns.add("mat_desc2", typeof(string));
 mattable.columns.add("mat_desc3", typeof(string));
 mattable.columns.add("mat_desc4", typeof(string));
 mattable.rows.add();
 mattable.rows[0]["mat_desc1"] = "201503";
 mattable.rows[0]["mat_desc2"] = "mz";
 mattable.rows[0]["mat_desc3"] = "0";
 mattable.rows[0]["mat_desc4"] = "17";
 mattable.rows.add();
 mattable.rows[1]["mat_desc1"] = "201504";
 mattable.rows[1]["mat_desc2"] = "mz";
 mattable.rows[1]["mat_desc3"] = "0";
 mattable.rows[1]["mat_desc4"] = "17";
 mattable.rows.add();
 mattable.rows[2]["mat_desc1"] = "201505";
 mattable.rows[2]["mat_desc2"] = "mz";
 mattable.rows[2]["mat_desc3"] = "0";
 mattable.rows[2]["mat_desc4"] = "17";
 mattable.rows.add();
 mattable.rows[3]["mat_desc1"] = "201506";
 mattable.rows[3]["mat_desc2"] = "mz";
 mattable.rows[3]["mat_desc3"] = "0";
 mattable.rows[3]["mat_desc4"] = "17";
 this.tableview1.datasource = mattable;
 this.tableview1.databind();
 }

b.columnheaderstyle属性

其中包括height属性（列标题高度）、fontsize属性（列标题文本大小）、backcolor属性（列标题背景颜色）和forecolor属性（列标题文本颜色），如图1；

将height属性设置为“10”，如图2；

将fontsize属性设置为“5”，如图3；

将backcolor属性设置为“white”，如图4；

将forecolor属性设置为“black”，如图5；

c.columns属性

打开集合编辑器，并点击"添加"按钮旁边的三角形按钮，选择需要的列的类型，其中包括tableviewlabelcolumn、tableviewbuttoncolumn、tableviewtextboxcolumn、tableviewcheckboxcolumn和tableviewimagecolumn五种列，如图6、图7；

d.gridlinescolor属性

设置tableview表格线的颜色，将该属性设置为“black”，如图8；

e.location属性

让控件显示在合适的位置（0, 122），如图9；

f.rowheight属性

设置表格行高度，将该属性设置为“15”，如图10；

g.size属性

设置控件的宽度和高度，将该属性设置为（120, 77），如图11；

二、手机效果显示

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。