2012-03-19 107 views
2

我目前正在使用透视控件制作WP7应用程序。我正在使用bindable application bar(不是默认的应用栏),因为我在我的应用程序中使用了MVVM。我想要更改显示的应用程序栏,具体取决于我当前所在的数据透视表项。折叠或使可见的自定义工具 - 可绑定的应用程序栏

因为我正在使用自定义应用栏工具,我想我可以折叠或使每个应用程序栏可见,具体取决于所处的哪个透视项,但应用程序栏不会折叠,只有锻炼应用程序栏在我的应用程序中显示(同样,这是因为我在我的XAML中最后定义了锻炼栏?)。

这种类型的工具不会崩溃吗?

XAML:

<Grid x:Name="LayoutRoot" 
    Background="Transparent"> 
<Grid.RowDefinitions> 
    <RowDefinition Height="Auto" /> 
    <RowDefinition Height="*" /> 
</Grid.RowDefinitions> 

<!--ContentPanel - place additional content here--> 
<Grid x:Name="ContentPanel" 
     Grid.Row="1" 
     Margin="12,0,12,0"> 
    <controls:Pivot Title="{Binding Name}" LoadingPivotItem="pivotMain_LoadingPivotItem"> 
     <controls:PivotItem Header="Details" Name="detailsItem"> 
      <view:EditClientDetails/> 
     </controls:PivotItem> 
     <controls:PivotItem Header="Workouts" Name="workoutItem"> 
      <ListBox> 
       <ListBoxItem> 
        <view:AddLunch/> 
       </ListBoxItem> 
      </ListBox> 
     </controls:PivotItem> 
     <controls:PivotItem Header="Diets" Name="dietItem"> 
      <ListBox> 
       <ListBoxItem> 
        <view:AddDinner /> 
       </ListBoxItem> 
      </ListBox> 
     </controls:PivotItem> 
    </controls:Pivot> 
    <!-- 
    <Button FontSize="30" FontFamily="Segoe WP" Content="Add Workout" Height="80" HorizontalAlignment="Left" Margin="25,500,0,0" Name="addWorkout" VerticalAlignment="Top" Width="400" Click="addWorkout_Click" /> 
    <Button FontSize="30" FontFamily="Segoe WP" Content="Add Diet" Height="80" HorizontalAlignment="Left" Margin="25,414,0,0" Name="addDiet" VerticalAlignment="Top" Width="400" Click="addDiet_Click" /> 
    <Button FontSize="30" FontFamily="Segoe WP" Content="Edit Details" Height="80" HorizontalAlignment="Left" Margin="25,328,0,0" Name="editDetails" VerticalAlignment="Top" Width="400" /> 
    --> 
    <Preview:BindableApplicationBar x:Name="AppBarEdit"> 
     <Preview:BindableApplicationBarIconButton 
     Command="{Binding AddClientCommand}" 
     IconUri="/Images/appbar.add.rest.png" 
     Text="Edit" /> 
     <Preview:BindableApplicationBarIconButton 
     Command="{Binding SaveClientCommand}" 
     IconUri="/Images/appbar.check.rest.png" 
     Text="Save Client" /> 
    </Preview:BindableApplicationBar> 

    <Preview:BindableApplicationBar x:Name="AppBarDiet"> 
     <Preview:BindableApplicationBarIconButton 
     Command="{Binding GenerateDietCommand}" 
     IconUri="/Images/appbar.add.rest.png" 
     Text="Generate" /> 
     <Preview:BindableApplicationBarIconButton 
     Command="{Binding SaveDietCommand}" 
     IconUri="/Images/appbar.check.rest.png" 
     Text="Save Diet" /> 
    </Preview:BindableApplicationBar> 

    <Preview:BindableApplicationBar x:Name="AppBarWorkout" Margin="-157,-70,157,70"> 
     <Preview:BindableApplicationBarIconButton 
     Command="{Binding GenerateWorkoutCommand}" 
     IconUri="/Images/appbar.add.rest.png" 
     Text="Generate" /> 
     <Preview:BindableApplicationBarIconButton 
     Command="{Binding SaveWorkoutCommand}" 
     IconUri="/Images/appbar.check.rest.png" 
     Text="Save Workout" /> 
    </Preview:BindableApplicationBar> 
</Grid> 

代码(只是在后面的代码的时刻用于测试目的):

private void pivotMain_LoadingPivotItem(object sender, PivotItemEventArgs e) 
{ 
    if (e.Item == workoutItem) 
    { 
     AppBarEdit.Visibility = System.Windows.Visibility.Collapsed; 
     AppBarWorkout.Visibility = System.Windows.Visibility.Visible; 
     AppBarDiet.Visibility = System.Windows.Visibility.Collapsed; 


    } 
    else if (e.Item == dietItem) 
    {  
     AppBarEdit.Visibility = System.Windows.Visibility.Collapsed; 
     AppBarWorkout.Visibility = System.Windows.Visibility.Collapsed; 
     AppBarDiet.Visibility = System.Windows.Visibility.Visible; 

    } 
    else if (e.Item == detailsItem) 
    { 
     AppBarEdit.Visibility = System.Windows.Visibility.Visible; 
     AppBarWorkout.Visibility = System.Windows.Visibility.Collapsed; 
     AppBarDiet.Visibility = System.Windows.Visibility.Collapsed; 
} 

回答

3

的WP7 UI支持单个ApplicationBar,其经由PhoneApplicationPage.ApplicationBar属性设置,可绑定的应用程序栏是框架类的包装器,所以它仍然具有相同的约束。

对于你所要做的,我只是写一点代码隐藏。这不会“破坏”MVVM模式。

+0

编写逻辑以确定应用栏是否显示视图逻辑,所以是可以放在代码后面。但是,你将如何处理这些行为?单击按钮时,如果要执行不同的操作(取决于数据透视项目),该怎么办? – ferics2 2012-08-09 19:04:07

0

尝试设置BindableAppBar的IsVisible属性。你可以有多个BindableAppBar。但是,一次只能显示一个。因此,如果您将两个AppBars的IsVisible设置为false,那么如果设置为True,则会显示第三个。

<bindableAppBar:BindableAppBar IsVisible="{Binding IsVisible1}"> 
    <bindableAppBar:BindableAppBarButton IconUri="/Assets/AppBar/AppIcon1.png" Text="Text1"/> 
</bindableAppBar:BindableAppBar> 

<bindableAppBar:BindableAppBar IsVisible="{Binding IsVisible2}"> 
    <bindableAppBar:BindableAppBarButton IconUri="/Assets/AppBar/AppIcon2.png" Text="Test2"/> 
</bindableAppBar:BindableAppBar>