0

現在のWindowsPhone7アプリでは、ダークとライトの2つのテーマを使用したいと考えています。また、アプリではパノラマコントロールとピボットコントロールも使用しています。各コントロールには、ダークテーマとライトテーマごとに異なる画像があります。

この目的のために、私は自分のプロジェクトで2つの別々のテーマを作成しました。ただし、テーマの画像を読み込めません。暗いバージョンか明るいバージョンかに応じて、テーマから画像を読み込む方法を教えてもらえますか？

4

3 に答える 3

1

画像のみを表示している場合は、ValueConverterを作成してテーマを決定できます。

// Assumes a dark theme image is passed in the parameter variable 
public class ImageThemeValueConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if(parameter == null) return null;

        Visibility darkBackgroundVisibility = 
            (Visibility)Application.Current.Resources["PhoneDarkThemeVisibility"];

        if (darkBackgroundVisibility == Visibility.Visible)
        {
            return new Uri(parameter.ToString();
        }
        else
        {
            string path = parameter.ToString();
            path = System.IO.Path.GetDirectoryName(path) + System.IO.Path.GetFileNameWithoutExtension(path) + ".light"+System.IO.Path.GetExtension(path);
            return new Uri(path);
        }
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

そしてあなたのxamlで：

<Image Source="{Binding Converter={StaticResource ImageThemeValueConverter}, ConverterParameter=Images/ThemeImage.png}"/>

画像をボタンに配置し、画像が背景色と前景色（白黒）のみを使用している場合は、色を変更するスタイルを使用できます。

<Button Style="{StaticResource PhoneButton}">
    <ImageBrush ImageSource="/Images/appbar.save.png" Stretch="None"/>
</Button>

そしてスタイル：

<Style TargetType="Button" x:Key="PhoneButton">
    <Setter Property="Width" Value="48"/>
    <Setter Property="Height" Value="48"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="ContentContainer">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <HorizontalAlignment>Stretch</HorizontalAlignment>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.VerticalAlignment)" Storyboard.TargetName="ContentContainer">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <VerticalAlignment>Stretch</VerticalAlignment>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ContentContainer">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Border">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="Border">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ContentContainer">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="Border">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="Border">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Grid>
                        <Ellipse x:Name="Border" Fill="{TemplateBinding Background}" Canvas.Left="0" Stretch="Fill" 
                                    StrokeThickness="3" StrokeLineJoin="Round" Stroke="{TemplateBinding BorderBrush}"/>
                        <Grid x:Name="ContentContainer" OpacityMask="{TemplateBinding Content}" Background="{TemplateBinding Foreground}"/>
                    </Grid>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
于 2012-05-27T20:14:38.343 に答える
0

次のコードスニペットを使用してテーマを決定し、それに応じて画像を設定できます。

if ((double)Application.Current.Resources["PhoneDarkThemeOpacity"] == 1)
{
  //Dark Theme
}
else
{
  //Light Theme
}

詳細については、こちらをご覧ください。

于 2012-05-26T09:38:26.750 に答える
0

より良いアプローチは、明るいテーマと暗いテーマの2つの別々のテーマを作成し、テーマの可視性ビットによってアプリケーションの読み込みを決定することだと思います。

私たちのテーマでは、そのような画像をロードできます

<BitmapImage x:Key="SearchImage" UriSource="/Images/searchIcon.png" />
于 2012-05-28T16:39:12.253 に答える