UWP-PivotItem鼠標懸停更改顏色

Question

我想用UWP結束鼠標時更改PivotItem標頭的Forground顏色，我使用Windows 10

我嘗試了這段代碼：

<Page.Resources>
        <SolidColorBrush x:Key="mouseOverColor"
                    Color="Red" />
    </Page.Resources>
<Pivot HeaderTemplate="{StaticResource HeaderTemp}" VerticalAlignment="Top" HorizontalAlignment="Center" Margin="10,0,10,0">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup>
                    <VisualState x:Name="Narrow">
                        <VisualState.StateTriggers>
                            <AdaptiveTrigger MinWindowWidth="0" />
                        </VisualState.StateTriggers>
                        <VisualState.Setters>
                            <Setter Target="Icon.(RelativePanel.AlignHorizontalCenterWithPanel)" Value="True" />
                            <Setter Target="LabelText.(RelativePanel.Below)" Value="Icon" />
                            <Setter Target="LabelText.(RelativePanel.AlignHorizontalCenterWith)" Value="Icon" />
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState x:Name="Wide">
                        <VisualState.StateTriggers>
                            <AdaptiveTrigger MinWindowWidth="500" />
                        </VisualState.StateTriggers>
                        <VisualState.Setters>
                            <Setter Target="Icon.(RelativePanel.AlignVerticalCenterWithPanel)" Value="True" />
                            <Setter Target="LabelText.(RelativePanel.RightOf)" Value="Icon" />
                            <Setter Target="LabelText.(RelativePanel.AlignVerticalCenterWith)" Value="Icon" />
                            <Setter Target="RelativePanel.Margin" Value="0,0,12,0"/>
                            <Setter Target="Icon.Margin" Value="0,0,0,0"/>
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Pivot.Resources>
                <Style x:Key="myStyle" TargetType="PivotItem">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="PivotItem">
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsMouseOver"
                  Value="True">
                                        <Setter Property="Background"
                   Value="{StaticResource mouseOverColor}" />
                                    </Trigger>
                                </ControlTemplate.Triggers>
                                <ContentPresenter />
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Pivot.Resources>
            <PivotItem Header="/images/img.png" Margin="12,10,12,0"  >
                <Grid>
                    .....
                </Grid>
            </PivotItem>

我有一個錯誤“在'ControlTemplate'類型中找不到附加屬性“ Triggers”，請問您有任何想法如何在通用應用程序中將鼠標懸停在鼠標上方時更改圖像的顏色。感謝您的幫助

Answer 1

您想更改圖像的顏色，我認為它不能在XAML設計器中完成，您可以這樣做：

XAML代碼：

    <Pivot>
        <PivotItem>
            <PivotItem.Header>
                <Image x:Name="headerimg" Source="Assets/1.jpg" PointerEntered="pointerEntered" PointerExited="pointerExited"/>
            </PivotItem.Header>
        </PivotItem>
    </Pivot>

.cs文件中的關鍵代碼：

private async void pointerEntered(object sender, PointerRoutedEventArgs e)
{
    StorageFile imgFile = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Assets\\1.jpg"));
    using(IRandomAccessStream streamIn = await imgFile.OpenReadAsync())
    {
        //decoder the img
        BitmapDecoder decoder = await BitmapDecoder.CreateAsync(BitmapDecoder.JpegDecoderId, streamIn);
        //get pixel
        PixelDataProvider proved = await decoder.GetPixelDataAsync(BitmapPixelFormat.Bgra8, BitmapAlphaMode.Straight, new BitmapTransform(),
            ExifOrientationMode.IgnoreExifOrientation, ColorManagementMode.DoNotColorManage);
        byte[] srcData = proved.DetachPixelData();

        // GRAYSCALE
        for (int i = 0; i < srcData.Length; i += 4)
        {
            double b = srcData[i]; //B
            double g = srcData[i + 1]; //G
            double r = srcData[i + 2]; //R
            //average
            double v = (r + g + b) / 3d;
            //replace old rgb
            srcData[i] = srcData[i + 1] = srcData[i + 2] = Convert.ToByte(v);
        }

        WriteableBitmap wbimg = new WriteableBitmap((int)decoder.PixelWidth, (int)decoder.PixelHeight);
        srcData.CopyTo(wbimg.PixelBuffer);
        this.headerimg.Source = wbimg;
    }

}

private async void pointerExited(object sender, PointerRoutedEventArgs e)
{
    StorageFile imgFile = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Assets\\1.jpg"));
    IRandomAccessStream streamIn = await imgFile.OpenReadAsync();
    BitmapImage bitmap = new BitmapImage();
    bitmap.SetSource(streamIn);
    this.headerimg.Source = bitmap;
}

要更改圖像的顏色，您需要解碼該圖像，獲取其RGB值，重寫這些值，然后將它們變回圖像。 而且， Image控件沒有Foreground屬性。