天天看點

Windows 8 應用開發 - 應用欄

   通過應用欄(AppBar)可以在需要時向使用者顯示各種應用指令。應用欄提供與使用者目前頁面或目前標明的内容相關的各種指令。預設情況下,應用欄處于隐藏狀态。當使用者沿螢幕邊緣從頂部或底部用手指劃動時會顯示應用欄,還可以通過單擊滑鼠右鍵顯示。在使用者啟動指令、點選應用界面或重複劃動手勢後,應用欄會自動消失。如果需要進行多選指令操作時,也可以以讓應用欄始終可見。

IC561717

建立應用欄

以下邊欄(BottomAppBar)為例,利用AppBar 控件編寫一個具有文本編輯功能的應用欄。

<Page.BottomAppBar>

    <AppBar x:Name="BottomAppBar">

        <Grid>

            <Grid.ColumnDefinitions>

                <ColumnDefinition Width="50*"/>

            </Grid.ColumnDefinitions>

            <StackPanel x:Name="LeftPanel" Orientation="Horizontal" Grid.Column="0" HorizontalAlignment="Left">

                <Button x:Name="Edit" Style="{StaticResource EditAppBarButtonStyle}" Click="Edit_Button_Click"/>

                <Button x:Name="Save" Style="{StaticResource SaveAppBarButtonStyle}"/>

                <Button x:Name="Delete" Style="{StaticResource DeleteAppBarButtonStyle}"/>

            </StackPanel>

            <StackPanel x:Name="RightPanel" Orientation="Horizontal" Grid.Column="1" HorizontalAlignment="Right">

                <Button x:Name="Refresh" Style="{StaticResource RefreshAppBarButtonStyle}"/>

        </Grid>

    </AppBar>

</Page.BottomAppBar>

     從上面代碼可以看出編寫應用欄本身并沒有什麼複雜之處,而且應用欄中使用按鍵的風格在Win8 應用中也都提供了。在項目工程Common 檔案夾中找到StandardStyles.xaml 裡面有很多注釋掉的ButtonStyle,在裡面找到你需要的提出來即可。

編輯應用欄

     接下來,我們在應用界面中添加兩個CheckBox:一個用來将應用欄固定,另一個用來新增或删除應用欄按鍵。

<StackPanel Orientation="Vertical" Grid.Row="1" Margin="120,50,0,0">

    <CheckBox x:Name="IsSticky" Content="IsSticky" Click="IsSticky_Click" />

    <CheckBox x:Name="AddHelpButton" Content="Add Help Button" Click="AddHelpButton_Click" />

</StackPanel>

image

     兩個CheckBox 點選事件代碼如下,當應用欄IsSticky 屬性激活後,隻能通過劃動下邊螢幕或滑鼠右鍵将取消顯示。

private void IsSticky_Click(object sender, RoutedEventArgs e)

{

    CheckBox cb = sender as CheckBox;

    AppBar ap = pageRoot.FindName("BottomAppBar") as AppBar;

    if (ap != null)

    {

        ap.IsSticky = (bool)cb.IsChecked;

    }

}

private void AddHelpButton_Click(object sender, RoutedEventArgs e)

    if ((bool)cb.IsChecked)

        Button helpButton = new Button();

        helpButton.Name = "Help";

        helpButton.Style = App.Current.Resources["HelpAppBarButtonStyle"] as Style;

        RightPanel.Children.Add(helpButton);

    else

        RightPanel.Children.RemoveAt(1);

screenshot_11132012_230534

源碼下載下傳

http://sdrv.ms/SSPQM2

本文轉自Gnie部落格園部落格,原文連結http://www.cnblogs.com/gnielee/archive/2012/11/13/windows8-app-develop-appbar.html,如需轉載請自行聯系原作者

繼續閱讀