<Toolkit>———LockablePivot

Toolkit中LockablePivot的外部属性、方法如下:

 1 namespace Microsoft.Phone.Controls
 2 {
 3     // Summary:
 4     //     The lockable Pivot extends the base Pivot control with a property that disables
 5     //     navigation between Pivot items.
 6     [StyleTypedProperty(Property = "ItemContainerStyle", StyleTargetType = typeof(PivotItem))]
 7     [TemplatePart(Name = "HeadersListElement", Type = typeof(PivotHeadersControl))]
 8     [TemplatePart(Name = "PivotItemPresenter", Type = typeof(ItemsPresenter))]
 9     public class LockablePivot : Pivot
10     {
11         // Summary:
12         //     Identifies the IsLocked dependency property.
13         public static readonly DependencyProperty IsLockedProperty;
14 
15         // Summary:
16         //     Initializes a new instance of the LockablePivot type.
17         public LockablePivot();
18 
19         // Summary:
20         //     Gets or sets a value indicating whether the control is locked.
21         public bool IsLocked { get; set; }
22 
23         // Summary:
24         //     Invoked when the Items property changes.
25         //
26         // Parameters:
27         //   e:
28         //     Information about the change.
29         protected override void OnItemsChanged(NotifyCollectionChangedEventArgs e);
30     }
31 }

从中我们只看出LockablePivot是继承自Pivot,并且只有一个IsLocked属性可以用,所以可知LockablePivot使用和Pivot基本一致。

下面我们看一下IsLocked使用效果:

(未锁效果,可左右滑动)                             (锁住效果,这个时候LockablePivot中只有一个PivotItem)

 

锁住的时候为什么LockablePivot只有一个PivotItem呢?

其实我们把LockablePivot反编译一下就知道原因了。(下面是一段反编译代码)

 1 private void OnIsLockedChanged(bool newValue)
 2 {
 3     this._isLocked = newValue;
 4     this._isUpdating = true;
 5     if (this._isLocked)
 6     {
 7         this._savedIndex = base.get_SelectedIndex();
 8         this.FadeOutHeaders();
 9         this.SaveAndRemoveItems();
10     }
11     else
12     {
13         this.RestoreItems();
14         this.FadeInHeaders();
15     }
16     this._isUpdating = false;
17 }
18 
19  

 

从中我们可以看出LockablePivot的实现原理:

  当IsLocked设置为true的时候,LockablePivot会保存当前的PivotItem项,然后把其他的PivotItem从LockablePivot中移除保存起来。

  当IsLocked设置为false的时候再将保存的PivotItem移回LockablePivot中。

 

下面是一个LockablePivot的简单使用例子:

TestCtrlPage.xaml
 1 <phone:PhoneApplicationPage 
 2     x:Class="TestLstBoxDemo.TestPage.TestCtrlPage"
 3     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 4     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 5     xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
 6     xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
 7     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
 8     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
 9     FontFamily="{StaticResource PhoneFontFamilyNormal}"
10     FontSize="{StaticResource PhoneFontSizeNormal}"
11     Foreground="{StaticResource PhoneForegroundBrush}"
12     SupportedOrientations="Portrait" Orientation="Portrait"
13     mc:Ignorable="d" d:DesignHeight="696" d:DesignWidth="480"
14     shell:SystemTray.IsVisible="True" 
15     xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit" 
16     xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
17     xmlns:my="clr-namespace:SinOrMulListBox;assembly=SinOrMulListBox" 
18     d:DataContext="{d:DesignData ../Design/ViewModelSampleData.xaml}">
19 
20     <!--LayoutRoot is the root grid where all page content is placed-->
21     <toolkit:LockablePivot x:Name="LockPivot" Title="Use LockablePivot">
22         <toolkit:LockablePivot.Resources>
23             <ResourceDictionary>
24                 <Style TargetType="TextBlock" x:Key="TBlock">
25                     <Setter Property="Margin" Value="0,0,0,-10"/>
26                     <Setter Property="FontSize" Value="60"/>
27                 </Style>
28             </ResourceDictionary>
29         </toolkit:LockablePivot.Resources>
30         <controls:PivotItem>
31             <controls:PivotItem.Header>
32                 <TextBlock Text="LockItem1" Style="{StaticResource TBlock}"/>
33             </controls:PivotItem.Header>
34             <Grid>
35                 <my:SinOrMulListBox Name="listBoxWithBoxes" Margin="0,0,0,0"  IsMultipleSelect="True" ItemsSource="{Binding SimpleModels}">
36                     <my:SinOrMulListBox.ItemTemplate>
37                         <DataTemplate>
38                             <StackPanel Orientation="Horizontal" Margin="0,0,0,20">
39                                 <Rectangle Height="100" Width="100" Fill="#FFE5001b" Margin="0,0,9,0"/>
40                                 <StackPanel>
41                                     <TextBlock Text="{Binding Name}" TextWrapping="Wrap" Style="{StaticResource PhoneTextLargeStyle}"/>
42                                     <TextBlock Text="{Binding Description}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
43                                 </StackPanel>
44                             </StackPanel>
45                         </DataTemplate>
46                     </my:SinOrMulListBox.ItemTemplate>
47                 </my:SinOrMulListBox>
48             </Grid>
49         </controls:PivotItem>
50         <controls:PivotItem>
51             <controls:PivotItem.Header>
52                 <TextBlock Text="LockItem2" Style="{StaticResource TBlock}"/>
53             </controls:PivotItem.Header>
54             <Grid />
55         </controls:PivotItem>
56     </toolkit:LockablePivot>
57 
58     <!--Sample code showing usage of ApplicationBar-->
59     <phone:PhoneApplicationPage.ApplicationBar>
60         <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
61             <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Lock" Click="Lock_Click"/>
62             <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="UnLock" Click="UnLock_Click"/>
63 
64             <shell:ApplicationBar.MenuItems>
65                 <shell:ApplicationBarMenuItem Text="开启单选" Click="ApplicationBarMenuItem_Click"/>
66                 <shell:ApplicationBarMenuItem Text="开启多选" Click="ApplicationBarMenuItem_Click_1"/>
67             </shell:ApplicationBar.MenuItems>
68         </shell:ApplicationBar>
69     </phone:PhoneApplicationPage.ApplicationBar>
70 
71 </phone:PhoneApplicationPage>
TestCtrlPage.xaml.cs
 1 using System;
 2 using System.Collections.Generic;
 3 using System.Linq;
 4 using System.Net;
 5 using System.Windows;
 6 using System.Windows.Controls;
 7 using System.Windows.Documents;
 8 using System.Windows.Input;
 9 using System.Windows.Media;
10 using System.Windows.Media.Animation;
11 using System.Windows.Shapes;
12 using Microsoft.Phone.Controls;
13 
14 namespace TestLstBoxDemo.TestPage
15 {
16     public partial class TestCtrlPage : PhoneApplicationPage
17     {
18         public TestCtrlPage()
19         {
20             InitializeComponent();
21 
22             this.Loaded += new RoutedEventHandler(LockablePivot_Loaded);
23         }
24 
25         void LockablePivot_Loaded(object sender, RoutedEventArgs e)
26         {
27             DataContext = App.ViewModel;
28         }
29 
30         protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
31         {
32             if (!App.ViewModel.IsDataLoaded)
33             {
34                 App.ViewModel.LoadData();
35             }
36             base.OnNavigatedTo(e);
37         }
38 
39         private void Lock_Click(object sender, EventArgs e)
40         {
41             this.LockPivot.IsLocked = true;
42         }
43 
44         private void UnLock_Click(object sender, EventArgs e)
45         {
46             this.LockPivot.IsLocked = false;
47         }
48 
49         //开启单选
50         private void ApplicationBarMenuItem_Click(object sender, EventArgs e)
51         {
52             listBoxWithBoxes.IsMultipleSelect = false;
53         }
54         //开启多选
55         private void ApplicationBarMenuItem_Click_1(object sender, EventArgs e)
56         {
57             listBoxWithBoxes.IsMultipleSelect = true;
58         }
59     }
60 }

源码

posted @ 2012-10-18 11:38  ╰→劉じ尛鶴  阅读(251)  评论(0编辑  收藏  举报