LongListSelector与列表项选择风格 [英] LongListSelector with list item selection style
问题描述
我的工作在Windows Phone 8和我有在它几个项目Longlist选择。
我使用了高亮在列表中选择的项目下面的代码box.But我要为LongListSelector要达到同样的效果。
怎么办呢?
<风格X:键=ListItemSelectorStyle的TargetType =ListBoxItem的>
< setter属性=背景值=透明/>
< setter属性=了borderThicknessVALUE =1/>
< setter属性=填充VALUE =0/>
< setter属性=HorizontalContentAlignmentVALUE =弹力/>
< setter属性=VerticalContentAlignmentVALUE =中心/>
< setter属性=前景VALUE =黑/>
< setter属性=模板>
< Setter.Value>
<的ControlTemplate的TargetType =ListBoxItem的>
< BORDER X:NAME =ListBoxItem的背景={TemplateBinding背景}
的HorizontalAlignment ={TemplateBinding的HorizontalAlignment}
VerticalAlignment ={TemplateBinding VerticalAlignment}
BorderBrush ={TemplateBinding BorderBrush}
了borderThickness ={TemplateBinding了borderThickness}>
< VisualStateManager.VisualStateGroups>
< VisualStateGroup X:NAME =CommonStates>
<的VisualState X:名称=正常/>
<的VisualState X:NAME =鼠标悬停>
<情节提要>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =ListItemBorderStoryboard.TargetProperty =背景>
< DiscreteObjectKeyFrame KeyTime =0值=#c9ebf2/>
< / ObjectAnimationUsingKeyFrames>
< /故事板>
< /&的VisualState GT;
<的VisualState X:名称=已禁用/>
< / VisualStateGroup>
< VisualStateGroup X:NAME =SelectionStates>
<的VisualState X:NAME =未选定/>
<的VisualState X:NAME =选择>
<情节提要>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =ListItemBorderStoryboard.TargetProperty =背景>
< DiscreteObjectKeyFrame KeyTime =0值=#c9ebf2/>
< / ObjectAnimationUsingKeyFrames>
< /故事板>
< /&的VisualState GT;
< / VisualStateGroup>
< /VisualStateManager.VisualStateGroups>
< BORDER =了borderThickness,0,0,0,1BorderBrush =黑>
< BORDER X:NAME =ListItemBorderBorderBrush =透明背景=#FFFFFF>
< ContentControl中X:NAME =ContentContainer
的ContentTemplate ={TemplateBinding的ContentTemplate}
含量={TemplateBinding内容}
HorizontalContentAlignment ={TemplateBinding HorizontalContentAlignment}
保证金={TemplateBinding填充}
VerticalContentAlignment ={TemplateBinding VerticalContentAlignment}/>
< /边框>
< /边框>
< /边框>
< /控件模板>
< /Setter.Value>
< /二传手>
< /样式和GT;
我试试你的代码,但的的LongListSelector控制显示可选项目的列表,包括一种机制,让用户跳转到列表中的特定部分。这是示例代码。
但如果你想达到像的ListBox ,您可以设置模板
$ b的效果$ b
< setter属性=模板>
< Setter.Value>
<的ControlTemplate的TargetType =电话:LongListSelector>
<网格背景={TemplateBinding背景}D:DesignWidth =480D:DesignHeight =800>
< VisualStateManager.VisualStateGroups>
< VisualStateGroup X:NAME =ScrollStates>
< VisualStateGroup.Transitions>
将; VisualTransition GeneratedDuration =00:00:00.5/>
< /VisualStateGroup.Transitions>
<的VisualState X:NAME =滚动>
<情节提要>
< DoubleAnimation是持续时间=0=1Storyboard.TargetProperty =透明度Storyboard.TargetName =VerticalScrollBar/>
< /故事板>
< /&的VisualState GT;
<的VisualState X:NAME =NotScrolling/>
< / VisualStateGroup>
< VisualStateGroup X:NAME =CommonStates>
<的VisualState X:名称=正常/>
<的VisualState X:NAME =Seleced>
<情节提要>
< ObjectAnimationUsingKeyFrames Storyboard.TargetProperty =背景Storyboard.TargetName =ViewportControl>
< DiscreteObjectKeyFrame KeyTime =0值=绿色/>
< / ObjectAnimationUsingKeyFrames>
< /故事板>
< /&的VisualState GT;
< / VisualStateGroup>
< /VisualStateManager.VisualStateGroups>
<电网保证金={TemplateBinding填充}>
< Grid.ColumnDefinitions>
< ColumnDefinition WIDTH =*/>
< ColumnDefinition宽度=自动/>
< /Grid.ColumnDefinitions>
< ViewportControl X:NAME =ViewportControlHorizontalContentAlignment =拉伸VerticalAlignment =顶部/>
<滚动条X:NAME =VerticalScrollBarGrid.Column =1保证金=4,0,4,0不透明度=0方向=垂直/>
< /网格和GT;
< /网格和GT;
< /控件模板>
< /Setter.Value>
< /二传手>
I am working on Windows Phone 8 and i have Longlist selector with few item in it.
I am using the below code for highlighting the selected item in the list box.But i want the same effect to be achieved for LongListSelector.
How to do it ?
<Style x:Key="ListItemSelectorStyle" TargetType="ListBoxItem">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Padding" Value="0" />
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property ="Foreground" Value="Black" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border x:Name="ListBoxItem" Background="{TemplateBinding Background}"
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
VerticalAlignment="{TemplateBinding VerticalAlignment}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListItemBorder" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="#c9ebf2" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled"/>
</VisualStateGroup>
<VisualStateGroup x:Name="SelectionStates">
<VisualState x:Name="Unselected"/>
<VisualState x:Name="Selected">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListItemBorder" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="#c9ebf2" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border BorderThickness="0,0,0,1" BorderBrush="Black">
<Border x:Name="ListItemBorder" BorderBrush="Transparent" Background="#FFFFFF">
<ContentControl x:Name="ContentContainer"
ContentTemplate="{TemplateBinding ContentTemplate}"
Content="{TemplateBinding Content}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
</Border>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I try your code, but the LongListSelector control display a list of selectable items with a mechanism for users to jump to a specific section of the list. This is the sample code.
But if you want achieved the effect like ListBox, you can set the template
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="phone:LongListSelector">
<Grid Background="{TemplateBinding Background}" d:DesignWidth="480" d:DesignHeight="800">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="ScrollStates">
<VisualStateGroup.Transitions>
<VisualTransition GeneratedDuration="00:00:00.5"/>
</VisualStateGroup.Transitions>
<VisualState x:Name="Scrolling">
<Storyboard>
<DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="VerticalScrollBar"/>
</Storyboard>
</VisualState>
<VisualState x:Name="NotScrolling"/>
</VisualStateGroup>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="Seleced">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ViewportControl">
<DiscreteObjectKeyFrame KeyTime="0" Value="Green"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Margin="{TemplateBinding Padding}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="auto"/>
</Grid.ColumnDefinitions>
<ViewportControl x:Name="ViewportControl" HorizontalContentAlignment="Stretch" VerticalAlignment="Top"/>
<ScrollBar x:Name="VerticalScrollBar" Grid.Column="1" Margin="4,0,4,0" Opacity="0" Orientation="Vertical"/>
</Grid>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
这篇关于LongListSelector与列表项选择风格的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!