的Windows Store應用flipview保證金

有了這個簡單的XAML代碼：的Windows Store應用flipview保證金

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid Width="230" Height="300" Background="Red" Margin="0"> 
     <FlipView Background="Blue" Margin="0" Padding="0" BorderThickness="0"/> 
    </Grid> 
</Grid>

結果：

flipView margin example

如何刪除flipview透明的「保證金」，這顯示紅色網格背景？

來源

2013-03-19 Lezme

這是因爲FlipView控件的默認樣式。

要刪除它，你需要複製這個默認樣式（貼在下面），並刪除在邊框邊緣：由

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="3">

：

<Style x:Key="FlipViewStyle1" TargetType="FlipView"> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="BorderThickness" Value="0"/> 
     <Setter Property="TabNavigation" Value="Once"/> 
     <Setter Property="IsTabStop" Value="False"/> 
     <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden"/> 
     <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden"/> 
     <Setter Property="ScrollViewer.IsHorizontalRailEnabled" Value="False"/> 
     <Setter Property="ScrollViewer.IsVerticalRailEnabled" Value="False"/> 
     <Setter Property="ScrollViewer.IsHorizontalScrollChainingEnabled" Value="True"/> 
     <Setter Property="ScrollViewer.IsVerticalScrollChainingEnabled" Value="True"/> 
     <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/> 
     <Setter Property="ScrollViewer.BringIntoViewOnFocusChange" Value="True"/> 
     <Setter Property="ItemsPanel"> 
      <Setter.Value> 
       <ItemsPanelTemplate> 
        <VirtualizingStackPanel AreScrollSnapPointsRegular="True" Orientation="Horizontal"/> 
       </ItemsPanelTemplate> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="FlipView"> 
        <Grid> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="FocusStates"> 
           <VisualState x:Name="Focused"> 
            <Storyboard> 
             <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualWhite"/> 
             <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualBlack"/> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Unfocused"/> 
           <VisualState x:Name="PointerFocused"/> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="3"> 
          <Border.Resources> 
           <ControlTemplate x:Key="HorizontalNextTemplate" TargetType="Button"> 
            <Border x:Name="Root" BorderBrush="{StaticResource FlipViewButtonBorderThemeBrush}" BorderThickness="{StaticResource FlipViewButtonBorderThemeThickness}" Background="{StaticResource FlipViewButtonBackgroundThemeBrush}"> 
             <VisualStateManager.VisualStateGroups> 
              <VisualStateGroup x:Name="CommonStates"> 
               <VisualState x:Name="Normal"/> 
               <VisualState x:Name="PointerOver"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
               <VisualState x:Name="Pressed"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
              </VisualStateGroup> 
             </VisualStateManager.VisualStateGroups> 
             <Path x:Name="Arrow" Data="M4.12,0 L9.67,5.47 L4.12,10.94 L0,10.88 L5.56,5.47 L0,0.06 z" Fill="{StaticResource FlipViewButtonForegroundThemeBrush}" HorizontalAlignment="Center" Height="10.94" Stretch="Fill" UseLayoutRounding="False" VerticalAlignment="Center" Width="9.67"/> 
            </Border> 
           </ControlTemplate> 
           <ControlTemplate x:Key="HorizontalPreviousTemplate" TargetType="Button"> 
            <Border x:Name="Root" BorderBrush="{StaticResource FlipViewButtonBorderThemeBrush}" BorderThickness="{StaticResource FlipViewButtonBorderThemeThickness}" Background="{StaticResource FlipViewButtonBackgroundThemeBrush}"> 
             <VisualStateManager.VisualStateGroups> 
              <VisualStateGroup x:Name="CommonStates"> 
               <VisualState x:Name="Normal"/> 
               <VisualState x:Name="PointerOver"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
               <VisualState x:Name="Pressed"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
              </VisualStateGroup> 
             </VisualStateManager.VisualStateGroups> 
             <Path x:Name="Arrow" Data="M5.55,0 L9.67,0.06 L4.12,5.47 L9.67,10.88 L5.55,10.94 L0,5.48 z" Fill="{StaticResource FlipViewButtonForegroundThemeBrush}" HorizontalAlignment="Center" Height="10.94" Stretch="Fill" UseLayoutRounding="False" VerticalAlignment="Center" Width="9.67"/> 
            </Border> 
           </ControlTemplate> 
           <ControlTemplate x:Key="VerticalNextTemplate" TargetType="Button"> 
            <Border x:Name="Root" BorderBrush="{StaticResource FlipViewButtonBorderThemeBrush}" BorderThickness="{StaticResource FlipViewButtonBorderThemeThickness}" Background="{StaticResource FlipViewButtonBackgroundThemeBrush}"> 
             <VisualStateManager.VisualStateGroups> 
              <VisualStateGroup x:Name="CommonStates"> 
               <VisualState x:Name="Normal"/> 
               <VisualState x:Name="PointerOver"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
               <VisualState x:Name="Pressed"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
              </VisualStateGroup> 
             </VisualStateManager.VisualStateGroups> 
             <Path x:Name="Arrow" Data="M0.06,0 L5.47,5.56 L10.88,0 L10.94,4.12 L5.48,9.67 L0,4.12 z" Fill="{StaticResource FlipViewButtonForegroundThemeBrush}" HorizontalAlignment="Center" Height="9.67" Stretch="Fill" UseLayoutRounding="False" VerticalAlignment="Center" Width="10.94"/> 
            </Border> 
           </ControlTemplate> 
           <ControlTemplate x:Key="VerticalPreviousTemplate" TargetType="Button"> 
            <Border x:Name="Root" BorderBrush="{StaticResource FlipViewButtonBorderThemeBrush}" BorderThickness="{StaticResource FlipViewButtonBorderThemeThickness}" Background="{StaticResource FlipViewButtonBackgroundThemeBrush}"> 
             <VisualStateManager.VisualStateGroups> 
              <VisualStateGroup x:Name="CommonStates"> 
               <VisualState x:Name="Normal"/> 
               <VisualState x:Name="PointerOver"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPointerOverForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
               <VisualState x:Name="Pressed"> 
                <Storyboard> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBackgroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedBorderThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                 <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Arrow"> 
                  <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource FlipViewButtonPressedForegroundThemeBrush}"/> 
                 </ObjectAnimationUsingKeyFrames> 
                </Storyboard> 
               </VisualState> 
              </VisualStateGroup> 
             </VisualStateManager.VisualStateGroups> 
             <Path x:Name="Arrow" Data="M5.63,0 L11.11,5.55 L11.05,9.67 L5.64,4.12 L0.23,9.67 L0.17,5.55 z" Fill="{StaticResource FlipViewButtonForegroundThemeBrush}" HorizontalAlignment="Center" Height="9.67" Stretch="Fill" UseLayoutRounding="False" VerticalAlignment="Center" Width="10.94"/> 
            </Border> 
           </ControlTemplate> 
          </Border.Resources> 
          <Grid> 
           <ScrollViewer x:Name="ScrollingHost" BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalSnapPointsType="MandatorySingle" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" IsTabStop="False" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsHorizontalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsHorizontalScrollChainingEnabled}" IsVerticalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsVerticalScrollChainingEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" Padding="{TemplateBinding Padding}" TabNavigation="{TemplateBinding TabNavigation}" VerticalSnapPointsType="MandatorySingle" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" ZoomMode="Disabled"> 
            <ItemsPresenter/> 
           </ScrollViewer> 
           <Button x:Name="PreviousButtonHorizontal" HorizontalAlignment="Left" Height="40" IsTabStop="False" Template="{StaticResource HorizontalPreviousTemplate}" VerticalAlignment="Center" Width="70"/> 
           <Button x:Name="NextButtonHorizontal" HorizontalAlignment="Right" Height="40" IsTabStop="False" Template="{StaticResource HorizontalNextTemplate}" VerticalAlignment="Center" Width="70"/> 
           <Button x:Name="PreviousButtonVertical" HorizontalAlignment="Center" Height="40" IsTabStop="False" Template="{StaticResource VerticalPreviousTemplate}" VerticalAlignment="Top" Width="70"/> 
           <Button x:Name="NextButtonVertical" HorizontalAlignment="Center" Height="40" IsTabStop="False" Template="{StaticResource VerticalNextTemplate}" VerticalAlignment="Bottom" Width="70"/> 
          </Grid> 
         </Border> 
         <Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashArray="1,1"/> 
         <Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" StrokeDashArray="1,1"/> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style>

簡單地改變邊界margin屬性：

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="0">

來源

2013-12-17 17:37:36 Gomino

FlipView往往保持一個小幅度。如果你只是強迫它一個Margin=-3它會顯示你想要的輸出。或者，您可以添加另一個元素，以確保沒有黑客從後面傳遞「光」。

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid Width="230" Height="300" Background="Red"> 
     <Grid Background="Blue"> 
      <FlipView/> 
     </Grid> 
    </Grid> 
</Grid>

來源

2013-07-13 13:18:36 MoDu

保證金減三是一個偉大的黑客，但它確實影響到刷卡有點 – 2014-08-13 14:14:36

@JPHellemons它如何影響滑動？我使用佔用全屏的flipview，所以我從來沒有看到任何其他的東西。 – MoDu 2014-09-17 17:19:07

我無法以某種方式進入最後一頁。 – 2014-09-18 08:21:59

的Windows Store應用flipview保證金

回答

相關問題