最近安装了LS,初步学习中，不过体验下来，真的很方便。但学习同样是痛苦。 LS工具同样还有不少小BUG。
请注意，screen的命名为"HOME"时，无法切换到“编写代码”状态。这种情况出现了好多次，应该是LS工具的问题。
LightSwitchers 你好 ！我希望你所有的乐趣和建筑用 RTM 酷的东西。我为这一结论的课程管理器系列的延迟道歉。如果你错过了，这里是以前的文章：
在这篇文章中，我们将会如何设计一个"Home"的屏幕。
主屏幕
在 LightSwitch，您可以指示将应用程序的"启动屏幕"屏幕。这意味着，屏幕会自动启动时启动应用程序。在我们的例子中，我们要创建一个主屏幕，当用户第一次启动该应用程序时提供不同的工作流切入点。
创建一个空白的屏幕
让我们首先创建要我们的主屏幕空白屏幕。若要创建一个空白屏幕，您可以在添加新的屏幕对话框中选择任何屏幕模板并离开屏幕数据，"(无)"。在我们的例子中，我们将选择列表-详细信息屏幕模板，屏幕"家"的名称和离开屏幕数据"(无)"。
设置启动屏幕
双击解决方案探索以打开应用程序设计器中的属性节点。
在应用程序设计器中选择"屏幕导航"选项卡。在菜单结构树中，选择"主页"和底部单击"设置"。这将作为应用程序的启动屏幕设置"主页"屏幕。最后，使用向上/向下箭头按钮右侧移动到顶部的菜单中的"家"屏幕。
如果你现在按下 f5 键，您将看到您启动该应用程序时自动打开"主页"屏幕。在左侧菜单也反映了您在应用程序设计器中指定的排序。
设计布局
我们有一个空白画布上启动。它是使用一些创造性汁设计我们的主屏幕中的时间。我们开始之前，让我们画出我们想事情和这是我们所：
总括而言，我们希望：
- 顶部漂亮徽标
- （应用程序） 的标题
- 副标题 （用于欢迎邮件）
- 说明 （用于说明、 新闻等）
- 我们的 4 主要工作流 （在我以前的文章中介绍） 的每个入口点 （链接）
- 搜索学生
- 创建学生
- 课程注册
- 课程目录
让我们来绘制一些图片周围的框，看看我们如何创造这种结构。有基本上 2 大层次垂直堆叠在彼此的顶部：
- 顶组： 包含图像和文本组。他们是水平方向堆叠。
- 底部组： 包含包围 4 x 2 的表的选项卡组
让我们回到 IDE。双击"Home"在解决方案资源管理器打开屏幕设计器中。首先，我们将创建的顶部和底部的组。由于他们将是垂直堆叠，更改"列布局"到"行布局"。这样的事情不会垂直拉伸在属性窗口中，设置为"最高"的垂直对齐方式。
使用"添加"下拉列表中添加 2 组主页屏幕节点下。
为顶部组水平堆积徽标和文本组，因为更改行布局中的顶级组列布局。底部集团是一个选项卡组，因此，我们将使用布局选项卡。
添加静态图像
接下来，我们要将徽标添加到顶部的组。此标志将静态图像。这意味着，是您提供的图像文件。
LightSwitch，在您的屏幕内容的树找到的每个视觉元素需要绑定到的一些数据。在大多数情况下，它们 （例如，学生列表或网格），数据库中的数据或在我们的例子，一个静态数据的属性。
若要创建静态数据，我们需要添加本地属性。要添加一段数据的命令栏上单击"添加数据项目"。在我们的例子中，我们希望本地图像类型的属性。名称"Image_Logo"属性，然后单击确定。
在屏幕设计器中，拖动并将新创建的 Image_Logo 到屏幕内容树。让我们把它放在我们刚才创建的顶级组下。
如果现在应用程序运行时，您将在屏幕上看到图像字段：
这是很大，但并不是我们想要。首先，我们不需要一个标签为"形象标志"。第二，这是一个静态图像，因此我们不希望用户能更新图像。我们可以轻松地照顾这些。在屏幕设计器中，更改图像控件从"图像编辑器"到"图像查看器"。
在属性 （与选定的徽标图像节点），将标签位置设置为"无"。
当我们在它时，我们还可以更改图像大小。
如果您再次运行应用程序，现在您将看到一个空白图像在屏幕上:
这是更像是 it…，但没有图像。
提供一个图像文件
现在，我们需要去到一个图像文件在计算机上安装我们创建的 Image_Logo 属性。
此过程要求有点编码。在屏幕设计器中，单击命令栏中的"写入代码"按钮并选择 Home_InitializeDataWorkspace。
在方法的正文中，Image_Logo 属性指定图像文件 （我有一个称为"logo.png"文件）：
Image_Logo = GetImageByName ("LightSwitchApplication.logo.png") //资源的全名称空间，LightSwitchApplication这个好象不能改，暂时还没发现。
GetImageByName 是一个 helper 函数，图像文件转换为字节数组。复制并粘贴以下的 helper 函数，屏幕的代码。
namespace LightSwitchApplication
{
public partial class MyHome
{
partial void MyHome_InitializeDataWorkspace(List<IDataService> saveChangesTo)
{
// 在此编写您的代码。
Image_Logo = GetImageByName("LightSwitchApplication.Logo.png");
Txt_Title = "学校的美术-书记官长办公室";
}
byte[] GetImageByName(string fileName)
{
System.Reflection.Assembly ass = System.Reflection.Assembly.GetExecutingAssembly();
System.IO.Stream s = ass.GetManifestResourceStream(fileName);
return GetStreamAsByteArray(s);
}
private byte[] GetStreamAsByteArray(Stream s)
{
int len = Convert.ToInt32(s.Length);
byte[] bs = new byte[len];
s.Read(bs, 0, len);
s.Close();
return bs;
}
}
}
现在，我们需要将图像文件添加到项目 （logo.png）。在解决方案资源管理器中，从逻辑视图切换到文件视图。
右键单击客户端节点。选择"添加"再"现有项目"。这将启动一个对话框，您可以浏览并选择您的图像文件。
在此对话框中，我会选择我的"logo.png"文件，并单击添加。图像文件将显示在客户端节点下。
与选定的图像文件，将生成操作设置为"嵌入的资源"在属性窗口中。
如果我们再次运行应用程序，现在您将看到您提供在屏幕上的图像文件。
添加静态文本
现在我们想添加一些文本徽标的旁边。首先，我们将创建新的组来容纳此文本 （标题、 副标题和说明）。在屏幕设计器中，添加新组徽标节点下面。
将静态文本添加遵循同样的概念添加静态图像。首先，我们将创建一张静态数据，在这种情况下，字符串 （而不是图像）。单击命令栏中的"添加数据项目"按钮，添加本地字符串类型的属性。名称 Text_Title 属性，然后单击确定。
拖放式的内容树 （在文本组中） 下的新创建的属性。
将控件从文本框中更改标签。设置为"无"在属性窗口中的标签的位置。LightSwitch 为基于文本的控件提供了一组预定义的文本样式。让我们也来设置字体样式属性为"Heading1"。
我们现在需要将 Text_Title 属性分配给某个值。单击命令栏上的按钮编写代码。在屏幕代码中，添加以下在 Home_InitializeDataWorkspace 方法中：
Text_Title = "学校的美术-书记官长办公室"
如果我们运行现在应用程序，您将看到较大并以粗体显示的字体在屏幕上显示的标题。
您可以按照同样的步骤，向屏幕中添加字幕和说明 （具有不同的字体样式）。
创建表布局
现在，我们准备将上移动到底部组。在我们开始之前，创建一些静态图像和文本数据的底部组使用。如果你看看该课程管理器示例，我已经添加了 4 个额外图像和 4 附加文本。
现在，如果你回来看看我们的绘图，我们需要下面的选项卡控件的表格。表 2 行和 4 列组成。为什么我们使用一个表布局，而不是行和列布局在这里？嗯，您当然可以。表布局，不过，在这种情况下线东西更好的表现。例如，如果您需要更大的边距之间和图像和文本，您可以调整它的整列次 。另外，我需要一个借口来向您展示表布局 J
添加新的组选项卡组根据。更改该控件以表格布局。在属性窗口中设置为"左"的水平对齐方式。
添加表布局下的 4 组。这些组将自动使用 TableColumn 布局。他们代表了我们的表中的 4 列。
第一列包含 2 图像。所以我们会拖，拖放到内容树 2 图像数据。
同样，拖放式 2 2nd列、 2 到 3路列，图像和 2 到 4日列文文本。将控件从图像编辑器更改为图像查看器和文本框标签。将其标签位置属性设置为"无"。如果您也可以设置为"自动"标签的高度属性，文本将很好地换行表格单元格中。
让我们运行该应用程序，看看我们在哪里。
将链接添加到屏幕
我们几乎没有 ！我们只需要添加一个链接，每个工作流。我们通过将导航的命令添加到工作流的屏幕可以做到这一点。右键单击文本搜索节点并选择添加按钮。
在该对话框中，SearchStudents 的方法的名称，然后单击确定。
将添加一个命令。将控件从按钮更改链接。
双击要转到的代码的命令。编写以下操作来启动 SearchStudent 屏幕，当用户单击该命令。
void SearchStudents_Execute(){
Application.ShowSearchStudents()
}
按照同样的步骤，添加链接的其余部分。让我们来运行该应用程序以查看主屏幕 ！
109
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
