locked
To navigate with the tab items without using tab control RRS feed

  • Question

  • I am doing a sketchflow prototype in which I have used 2 tab items (Browse and Page). I have designed states to activate the tabs but when I right click and activate the tab it is not reflection when I execute....

    Is that do I have to use tabcontrol - sketch to activate the tabs or can I use the tab item itself?

    I'm attaching the url for the sample screenshot.

    http://www.box.net/shared/qz4lzh3ndr

    and the below is the XAML Code

    <Grid x:Name="LayoutRoot" Background="White">
      <VisualStateManager.VisualStateGroups>
       <VisualStateGroup x:Name="tabItemActivate">
        <VisualState x:Name="browseActivate"/>
        <VisualState x:Name="pageActivate">
         <Storyboard>
          <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="tabItem" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
           <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF2C2C2C"/>
          </ColorAnimationUsingKeyFrames>
          <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="tabItem" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)">
           <SplineColorKeyFrame KeyTime="00:00:00" Value="White"/>
          </ColorAnimationUsingKeyFrames>
          <BooleanAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="tabItem" Storyboard.TargetProperty="(Selector.IsSelected)">
           <DiscreteBooleanKeyFrame KeyTime="00:00:00" Value="True"/>
          </BooleanAnimationUsingKeyFrames>
          <BooleanAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="tabItem1" Storyboard.TargetProperty="(Selector.IsSelected)">
           <DiscreteBooleanKeyFrame KeyTime="00:00:00" Value="True"/>
          </BooleanAnimationUsingKeyFrames>
          <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="tabItem1" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)">
           <SplineColorKeyFrame KeyTime="00:00:00" Value="#FF2C2C2C"/>
          </ColorAnimationUsingKeyFrames>
          <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="tabItem1" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
           <SplineColorKeyFrame KeyTime="00:00:00" Value="#FFF5F5E7"/>
          </ColorAnimationUsingKeyFrames>
         </Storyboard>
        </VisualState>
       </VisualStateGroup>
      </VisualStateManager.VisualStateGroups>
      <Grid.RowDefinitions>
       <RowDefinition Height="Auto" MinHeight="70.998"/>
       <RowDefinition Height="Auto" MinHeight="7.002"/>
      </Grid.RowDefinitions>
      <ps:SketchRectangleUC Margin="-15,0,-13,0" Style="{DynamicResource Rectangle-Sketch}" VerticalAlignment="Top" Height="78" Background="#FF2C2C2C" BorderBrush="{x:Null}" Grid.RowSpan="2"/>
      <ps:SketchRectangleUC HorizontalAlignment="Left" Margin="17,-32.998,0,0" Style="{DynamicResource Rectangle-Sketch}" VerticalAlignment="Top" Width="92.666" Height="38" Background="#FF2C2C2C" BorderBrush="{x:Null}" Grid.Row="1"/>
      <TextBlock HorizontalAlignment="Left" Margin="22.667,-27,0,0" Style="{DynamicResource BasicTextBlock-Sketch}" ToolTip="Open Menu" VerticalAlignment="Top" Width="71" Height="34" Foreground="White" Text="Site Actions" Grid.Row="1"/>
      <Image HorizontalAlignment="Left" Margin="98.668,52.998,0,0" ToolTip="Open Menu" VerticalAlignment="Top" Width="5" Height="3" Source="Images\arrdwn_wt.gif" Stretch="Fill"/>
      <Image HorizontalAlignment="Left" Margin="113.666,45.334,0,0" ToolTip="Navigate Up" VerticalAlignment="Top" Width="16" Height="14" Source="Images\folderarr.gif" Stretch="Fill"/>
      <Image HorizontalAlignment="Left" Margin="137.334,46.333,0,0" ToolTip="Edit" VerticalAlignment="Top" Width="14" Height="14" RenderTransformOrigin="0.357,0.429" Source="Images\editicon.jpg" Stretch="Fill"/>
      <TabItem x:Name="tabItem" HorizontalAlignment="Left" Margin="193,-32.998,0,0" Style="{DynamicResource TabItem-Sketch}" VerticalAlignment="Top" Width="80" Height="40" Background="#FFF5F5E7" BorderBrush="{x:Null}" Header="Browse" IsSelected="True" Grid.Row="1">
       <TabItem.InputScope>
        <InputScope>
         <InputScope.Names>
          <InputScopeName NameValue="Default"/>
         </InputScope.Names>
        </InputScope>
       </TabItem.InputScope>
       <i:Interaction.Triggers>
        <i:EventTrigger EventName="MouseDown">
         <pb:ActivateStateAction TargetScreen="teamsite_prototypeScreens.Screen_2" TargetState="browseActivate"/>
        </i:EventTrigger>
       </i:Interaction.Triggers>
       <Grid/>
      </TabItem>
      <ps:SketchRectangleUC HorizontalAlignment="Right" Margin="0,8,59.657,0" Style="{DynamicResource Rectangle-Sketch}" VerticalAlignment="Top" Width="294" Height="31" Background="#FF2C2C2C" BorderBrush="{x:Null}"/>
      <TextBlock HorizontalAlignment="Right" Margin="0,12.81,79.157,0" Style="{DynamicResource BasicTextBlock-Sketch}" VerticalAlignment="Top" Width="64.509" Height="15.822" RenderTransformOrigin="0.511,1.318" Foreground="White" Text="User Name "/>
      <Image HorizontalAlignment="Right" Margin="0,20.822,70.157,0" VerticalAlignment="Top" Width="5" Height="3" Source="Images\arrdwn_wt.gif" Stretch="Fill"/>
      <Image HorizontalAlignment="Right" Margin="0,16.014,32.971,0" VerticalAlignment="Top" Width="16" Height="16" Source="Images\usericon.jpg" Stretch="Fill"/>
      <TabItem x:Name="tabItem1" HorizontalAlignment="Left" Margin="277,-32.998,0,-3.027" Style="{DynamicResource TabItem-Sketch}" Width="53" Height="40" Background="#FF2C2C2C" BorderBrush="{x:Null}" Foreground="White" Grid.Row="1" Header="Page">
       <TabItem.InputScope>
        <InputScope>
         <InputScope.Names>
          <InputScopeName NameValue="Url"/>
         </InputScope.Names>
        </InputScope>
       </TabItem.InputScope>
       <i:Interaction.Triggers>
        <i:EventTrigger EventName="MouseDown">
         <pb:ActivateStateAction TargetScreen="teamsite_prototypeScreens.Screen_2" TargetState="pageActivate"/>
        </i:EventTrigger>
       </i:Interaction.Triggers>
       <Grid/>
      </TabItem>
     </Grid>
    </UserControl>

    Wednesday, May 12, 2010 12:50 PM

All replies