如何在Zebra的Xamarin頁面的底部創建固定按鈕？

Question

我需要使用列表視圖在頁面底部創建兩個按鈕。所以，我創建了頁面的主體兩個堆棧，並把ListView和按鈕將它們象下面這樣：

<z-place inside="Body"> 
    <Stack Direction="Vertical"> 
     <Stack Id="top"> 

    </Stack> 
    <Stack Id="bottomMenu" Direction="Horizontal"> 
    <Button Text="Btn1" CssClass="btmButton1"></Button> 
    <Button Text="Btn2" CssClass="btmButton2"></Button> 
    </Stack> 
</Stack> 
</z-place> 

而且樣式表是這樣的：

//Android.scss

.btmButton1 { 
    background: linear-gradient(to bottom, #039795, #196e6d); 
    color: #ffffff; 
    height: 52px; 
    margin: 0; 
    border-radius: 0; 
} 

.btmButton2 { 
    background: linear-gradient(to bottom, #5c0eb3, #3f1968); 
    color: #ffffff; 
    height: 52px; 
    margin: 0; 
    border-radius: 0; 
} 

#top { 
    height: calc("(Zebble.Device.Screen.Height - view.ActualHeight)-140"); 
    background: #dadada 
} 

#bottomMenu { 
    width: calc("Zebble.Device.Screen.Width"); 
    margin-top: calc("(Zebble.Device.Screen.Height - view.ActualHeight)-140"); 
    position: fixed; 
} 

但是，當我設置#top高度按鈕被隱藏。

Answer 1

要在導航欄頁面的底部製作按鈕欄，您可以在common.scss中爲所有平臺使用此css角色。

.btmButton1 { 
background: linear-gradient(to bottom, #039795, #196e6d); 
color: #ffffff; 
height: 52px; 
margin: 0; 
border-radius: 0; 
} 

.btmButton2 { 
background: linear-gradient(to bottom, #5c0eb3, #3f1968); 
color: #ffffff; 
height: 52px; 
margin: 0; 
border-radius: 0; 
} 

#top { 
height: calc("(Zebble.Device.Screen.Height - 116)"); 
background: #dadada 
} 

#bottomMenu { 
width: calc("Zebble.Device.Screen.Width"); 
height:52px; 
} 

和你的主頁視圖代碼體是：

<z-place inside="Body"> 
    <Stack Direction="Vertical"> 

     <Modules.ContactsList Id="top" /> 

    <Stack Id="bottomMenu" Direction="Horizontal"> 
     <Button Text="Btn1" CssClass="btmButton1"></Button> 
     <Button Text="Btn2" CssClass="btmButton2"></Button> 
    </Stack> 
    </Stack> 
</z-place> 

有一個在上面的代碼一份公告列表視圖，在列表視圖中，你應該使用滾動視圖，你能上下滾動你的列表。