无法在uwp中更改flipview的背景?

时间:2018-06-23 14:08:17

标签: uwp uwp-xaml

我发现flipview的背景无法更改...

<Page
    x:Class="CoreSocialistValues.Views.ImageGalleryCSV2DetailPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:models="using:CoreSocialistValues.Models"
    KeyDown="OnKeyDown"
    mc:Ignorable="d">

    <Page.Resources>
        <Storyboard x:Name="showFlipView" Completed="OnShowFlipViewCompleted">
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="flipView" BeginTime="0:0:0.5">
                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="shapeGrid" BeginTime="0:0:0.5">
                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
            </ObjectAnimationUsingKeyFrames>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="previewImage" BeginTime="0:0:0.6">
                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </Page.Resources>

    <Grid>
        <FlipView Background="SeaGreen"
            x:Name="flipView"
            Visibility="Visible"
            FocusVisualPrimaryThickness="1,1,1,1"
            ItemsSource="{x:Bind Source}"
            SelectedItem="{x:Bind SelectedImage, Mode=TwoWay}">
            <FlipView.ItemTemplate>
                <DataTemplate x:DataType="models:SampleImage">
                    <Viewbox StretchDirection="DownOnly">
                        <Image
                            x:Name="detailImage"
                            Stretch="None"
                            Source="{x:Bind Source, Mode=OneWay}" />
                    </Viewbox>
                </DataTemplate>
            </FlipView.ItemTemplate>
        </FlipView>


        <Grid x:Name="shapeGrid"/>
        <Image
            x:Name="previewImage"
            Style="{StaticResource DetailImageStyle}"
            Source="{x:Bind SelectedImage.(models:SampleImage.Source), Mode=OneWay}" />
    </Grid>
</Page>

然后我试图修改flipview的模板,什么也没发生。

我创建了一个新项目,可以更改flipview的背景。...

那么有什么办法可以改变它?

1 个答案:

答案 0 :(得分:1)

  

请参阅ImageGalleryCSV2DetailPage,我要将背景设置为透明,以便整个窗口背景看起来模糊。

无法为<input type="hidden" name="beautician<?php echo $data[0]; ?>[]" id="beautician-<?php echo $data[0]; ?>"> <select name="beautician[<?php echo $data[0]; ?>]" id="beauty" onchange="pvalue(this, '<?php echo $data[0]; ?>')"> <option value="null">Select</option> </select> <script> function pvalue(obj, rowid) { var x = obj.value; var y = document.getElementById('beautician-' + rowid).value = x; } </script> 设置背景的问题是因为您在FlipView中为FlipView设置了自定义样式。通过这种样式,您将/Styles/FlipView.xaml的ControlTemplate的根面板Grid的背景设置为“透明”。当您为FlipView设置背景时,它将覆盖背景。这就是为什么在设置FlipView时始终看不到背景的原因。

您可以像下面这样使用FlipView

{TemplateBinding Background}

此后,如果您将<Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="FlipView"> <Grid Background="{TemplateBinding Background}" ...... 设置为Background="SeaGreen",则会发现它运行良好。

enter image description here

然后,您说FlipView

要实现此效果,您需要在背景上应用一些Acrylic brush

例如,

that the whole window background seems blured