如何在Zebble中为Xamarin制作Metro UI？
如何在Zebble中为Xamarin制作Metro UI？
提问于 2017-04-13 16:06:22
在下面的链接中，我读到了中的堆栈和网格。
http://zebble.net/docs/gridltttemplate-tdatagt-class
在此之后，我尝试为Ze球创建metro界面，但我不知道如何创建不同大小的网格或堆栈，就像windows主菜单一样，我在下面提供了一个屏幕截图。
然后，我尝试用网格元素创建一些内容，以便在下面的代码中显示一个具有某些背景的文本表，如metro。
<Grid Columns="2">
<z-Component z-type="Cell" z-base="GridCell[Stack]">
<TextView Text="One" Style.BackgroundColor="#cccccc"></TextView>
<TextView Text="Two" Style.BackgroundColor="#ccffee"></TextView>
<TextView Text="Three" Style.BackgroundColor="#ffcccc"></TextView>
<TextView Text="Four" Style.BackgroundColor="#ccccff"></TextView>
</z-Component>
</Grid>但是，在我的页面上没有什么改变
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-04-14 20:15:16
要创建类似您上传的图像，您可以使用堆栈元素在windows手机中显示菜单或类似metro的项目。
我制作了一些类似metro的内容，向您展示如何使用SCSS和Zebble为Xamarin扩展创建类似metro的内容。
这是windows平台上应用程序的样式表：
Windows.scss:
.metroItemType1{
width:50%;
height:50px;
margin:3px;
}
.metroItemType2 {
width: 25%;
height: 50px;
margin: 3px;
}
.metroItemType3 {
width: auto;
height: 34px;
margin: 3px;
}这是Zebble中MetroUI模块的样式表：
MetroUI Module.zbl
<z-Component z-type="MetroUI"
z-base="Stack"
z-namespace="UI.Modules"
Direction="Vertical"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="../.zebble-schema.xml">
<Stack Direction="Horizontal">
<Stack CssClass="metroItemType1" Style.BackgroundColor="#d2ff52">
</Stack>
<Stack CssClass="metroItemType2" Style.BackgroundColor="#4575D3">
</Stack >
</Stack>
<Stack Direction="Horizontal">
<Stack CssClass="metroItemType1" Style.BackgroundColor="#4575D3">
</Stack>
<Stack CssClass="metroItemType2" Style.BackgroundColor="#235C6B">
</Stack >
</Stack>
<Stack Direction="Horizontal">
<Stack CssClass="metroItemType1" Style.BackgroundColor="#F2E24F">
</Stack>
<Stack CssClass="metroItemType3" Style.BackgroundColor="#713093">
</Stack>
</Stack>
</z-Component>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43397002
复制相关文章
相似问题
腾讯云开发者
