WindowsストアアプリをVisualStudio2015で開発中です。
現在ListViewのデザインをしているのですが、
マウスオーバー(ホバー？プルオーバー？)時と選択時の背景色の設定をxaml側でどう設定すればよいかわかりません。
下記は既存のデザインテンプレートです。
プログラムの方でしかできなさそうでしょうか？
今のところ紫にデフォルトでなっています。

C#
1<Page.Resources>
2        <Style x:Key="ListViewStyle1" TargetType="ListView">
3            <Setter Property="IsTabStop" Value="False"/>
4            <Setter Property="TabNavigation" Value="Once"/>
5            <Setter Property="IsSwipeEnabled" Value="True"/>
6            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
7            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
8            <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled"/>
9            <Setter Property="ScrollViewer.IsHorizontalRailEnabled" Value="False"/>
10            <Setter Property="ScrollViewer.VerticalScrollMode" Value="Enabled"/>
11            <Setter Property="ScrollViewer.IsVerticalRailEnabled" Value="False"/>
12            <Setter Property="ScrollViewer.ZoomMode" Value="Disabled"/>
13            <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/>
14            <Setter Property="ScrollViewer.BringIntoViewOnFocusChange" Value="True"/>
15            <Setter Property="ItemContainerTransitions">
16                <Setter.Value>
17                    <TransitionCollection>
18                        <AddDeleteThemeTransition/>
19                        <ContentThemeTransition/>
20                        <ReorderThemeTransition/>
21                        <EntranceThemeTransition IsStaggeringEnabled="False"/>
22                    </TransitionCollection>
23                </Setter.Value>
24            </Setter>
25            <Setter Property="ItemsPanel">
26                <Setter.Value>
27                    <ItemsPanelTemplate>
28                        <ItemsStackPanel Orientation="Vertical"/>
29                    </ItemsPanelTemplate>
30                </Setter.Value>
31            </Setter>
32            <Setter Property="Template">
33                <Setter.Value>
34                    <ControlTemplate TargetType="ListView">
35                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
36                            <ScrollViewer x:Name="ScrollViewer" AutomationProperties.AccessibilityView="Raw" BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsHorizontalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsHorizontalScrollChainingEnabled}" IsVerticalScrollChainingEnabled="{TemplateBinding ScrollViewer.IsVerticalScrollChainingEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" TabNavigation="{TemplateBinding TabNavigation}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}">
37                                <ItemsPresenter FooterTransitions="{TemplateBinding FooterTransitions}" FooterTemplate="{TemplateBinding FooterTemplate}" Footer="{TemplateBinding Footer}" HeaderTemplate="{TemplateBinding HeaderTemplate}" Header="{TemplateBinding Header}" HeaderTransitions="{TemplateBinding HeaderTransitions}" Padding="{TemplateBinding Padding}"/>
38                            </ScrollViewer>
39                        </Border>
40                    </ControlTemplate>
41                </Setter.Value>
42            </Setter>
43        </Style>
44    </Page.Resources>
45
46    
47    
48    
49<!--実行プログラムページ-->
50    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
51        <ListView x:Name="listView"  Style="{StaticResource ListViewStyle1}" HorizontalAlignment="Center">
52                  <Grid>
53                      <TextBlock Text="リストビューのテスト"/>
54                  </Grid>
55
56
57
58        </ListView>
59
60
61
62
63    </Grid>

このサイトを参考にしましたが、
https://msdn.microsoft.com/ja-jp/library/windows/apps/xaml/windows.ui.xaml.controls.listview.aspx
http://grabacr.net/archives/1240
ストアアプリではないような気がして、、、
ストアアプリの情報少ないですよね。。
上にあげたサイトが近いのですが、日本語でわかりやすく解説等してるサイトがありましたら教えてください。
宜しくお願いいたします。

行動規範の内容に同意します

回答1件

ベストアンサー

こんにちは

こちらに確認手段がないので、曖昧な回答お許しください。

質問文に書かれていた以下のサイトから以下のコードを書いてみましたが、どうなりますか？
http://grabacr.net/archives/1240

C#
1<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
2    <ListView x:Name="listView"  HorizontalAlignment="Center">
3        <ListView.ItemContainerStyle>
4            <Style TargetType="ListViewItem">
5                <Setter Property="OverridesDefaultStyle" Value="True" />
6                <Setter Property="Template">
7                   <Setter.Value>
8                        <ControlTemplate TargetType="{x:Type ContentControl}">
9                            <Border Background="{TemplateBinding Background}">
10                                <ContentPresenter />
11                            </Border>
12                        </ControlTemplate>
13                    </Setter.Value>
14                </Setter>
15                <Style.Triggers>
16                    <Trigger Property="IsSelected" Value="True">
17                        <Setter Property="Background" Value="Plum" />
18                    </Trigger>
19                    <Trigger Property="IsMouseOver" Value="True">
20                        <Setter Property="Background" Value="LightGray" />
21                    </Trigger>
22                </Style.Triggers>
23            </Style>
24        </ListView.ItemContainerStyle>
25        <Grid>
26            <TextBlock Text="リストビューのテスト"/>
27        </Grid>
28    </ListView>
29</Grid>

ここのサイトも参考にしてみてください。
ListViewItem スタイルとテンプレート

以上です。

投稿2015/10/20 06:19

daichan

総合スコア225

b1ackc0ffee

2015/10/20 07:32

お世話になります OverridesDefaultStyle と TargetType="{x:Type ContentControl}" と Style.Triggers にエラーが出ているため、ストアアプリでは使えないようです。 ListViewとListViewItemの違いが何かはわかりませんが、日本語のページも一部あるんですね＾＾ありがとうございます。

daichan

2015/10/20 08:30

> OverridesDefaultStyle > と > TargetType="{x:Type ContentControl}" > と > Style.Triggers > にエラーが出ているため、ストアアプリでは使えないようです。ありがとうございます。状況がわかりました。では、先程のリンクをご覧いただけますでしょうか。こちらはストアアプリのページなので大丈夫かと思います。 > ListViewとListViewItemの違いが何かはわかりませんが、 ListViewItemは、リストビューの１項目分のビュークラスになります。ですので、今回の背景色を変える場合には、このListViewItemクラスをいじることになると思います。

b1ackc0ffee

2015/10/21 02:54

ありがとうございます、色々試してみました＾＾特にリンク先の、 <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Focused"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisual" /> </Storyboard> </VisualState> <VisualState x:Name="Unfocused"/> <VisualState x:Name="PointerFocused"/> </VisualStateGroup> のあたりが怪しいんじゃないかと思っていましたが、 <GridView.ItemContainerStyle> <Style TargetType ="GridViewItem"> <Setter Property ="Margin" Value="0 0 0 0"/> <Setter Property ="Padding" Value="0 0 0 0"/> <Setter Property ="Template"> <Setter.Value> <ControlTemplate TargetType ="GridViewItem"> <ContentPresenter /> </ControlTemplate> </Setter.Value> </Setter> </Style> </GridView.ItemContainerStyle> を </GridView.ItemTemplate> の後に記入することで、デフォルトの挙動を削除することができました。今回は、違う色にするのではなく、消したかっただけなのでいったん大丈夫です★ リンクあたりを見ながらいろいろ試したいと思います！

行動規範の内容に同意します