积极答复者
listbox拖动时,选中的listitem的变化问题

问题
-
想做这样的效果:
拖动listbox时, 只改变首次点到的那个item的style,变一下颜色或大小。我用了以下代码,在模拟器上可以,但是手机上手指一滑动,选中的item也会变化,有什么方法可以解决?<Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<TextBlock x:Name="textBlock" Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver">
<Storyboard>
<ColorAnimation Duration="0" To="#FFEF5858" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/>
<DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(TextBlock.FontSize)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled"/>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Unfocused"/>
<VisualState x:Name="Focused"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</TextBlock>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<ListBox Margin="0,0,-12,0" ItemsSource="{Binding Items}" ItemContainerStyle="{StaticResource ListBoxItemStyle}"/>
答案
-
出现这样效果的原因是你将改变颜色和字体大小的Animation放在<VisualState x:Name="MouseOver">里,当鼠标滑过出现动画。可以尝试将它们放到<VisualState x:Name="Selected">里,当某一item被选择时颜色和字体大小改变;但此时鼠标移开时,item不会变回原状。
<VisualStateGroup x:Name="SelectionStates"> <VisualState x:Name="Unselected"/> <VisualState x:Name="Selected"> <Storyboard> <ColorAnimation Duration="0" To="#FFEF5858" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/> <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(TextBlock.FontSize)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/> </Storyboard> </VisualState> </VisualStateGroup>
如果你要实现TiltEffect类似的效果,可以参考上面链接中的例子定义一个DependencyProperty,定义全局的效果。有关依赖属性的更多信息,请参考:
http://msdn.microsoft.com/zh-cn/library/cc221408(v=vs.95).aspx
希望能帮助到你。
- 已编辑 Haixia_XieModerator 2012年5月17日 9:27
- 已标记为答案 Haixia_XieModerator 2012年5月22日 6:33
-
找不到Title1是因为Storyboard1和Textblock(Title1)在不同的namespace里。可以尝试在后台代码中定义StoryBoard,然后在Title1_ManipulationStarted方法里设置或更改其TargetName。
参考下面链接中的例子在后台定义storyboard。
- 已标记为答案 Haixia_XieModerator 2012年5月22日 6:33
全部回复
-
你好,
你的贴的代码是不是不完全?在我这边测试不出效果。WP中ListBox本身就实现了这一效果,当首次选中时改变item的字体颜色。请问你是要什么样的效果呢?
下面文章中的例子中的ListBoxItem有倾斜效果字体颜色也改变了,供参考:
-
你好,我用的就是那段代码,只是改变了字体颜色和大小,当手指按到屏幕上拖动会看到效果的,但是比较慢的拖动会看到选中的item在变化。另外listbox本身的效果是选中后手指离开item的颜色确实变了,但是像我上面改变了style,listbox本是的效果就没有了。
我要实现的是,但手指放都屏幕上拖动listbox时,只要求第一次接触到的那个item有变化,我上面那段代码在模拟器上可以,应该是鼠标定位比较准,在拖动的时候不会指到其他他item上。
你上面给我的例子应该 就是我说的 toolkit中的TiltEffect效果, 但是下载到的源码中只有一个TiltEffect文件,且没有后缀,打开看着像个网页,不知道怎么回事
-
下面是用你定义的ListBoxItemStyle写的测试代码,但并不能重现你说的那个效果。
<phone:PhoneApplicationPage.Resources> <Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ListBoxItem"> <TextBlock x:Name="textBlock" Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"> <Storyboard> <ColorAnimation Duration="0" To="#FFEF5858" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/> <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(TextBlock.FontSize)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/> </Storyboard> </VisualState> <VisualState x:Name="Disabled"/> </VisualStateGroup> <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Unfocused"/> <VisualState x:Name="Focused"/> </VisualStateGroup> </VisualStateManager.VisualStateGroups> </TextBlock> </ControlTemplate> </Setter.Value> </Setter> </Style> </phone:PhoneApplicationPage.Resources> <!--LayoutRoot is the root grid where all page content is placed--> <Grid x:Name="LayoutRoot" Background="Transparent"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <!--TitlePanel contains the name of the application and page title--> <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> <TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/> <TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> </StackPanel> <!--ContentPanel - place additional content here--> <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <ListBox x:Name="listbox" Width="100" Height="300" ItemContainerStyle="{StaticResource ListBoxItemStyle}" /> </Grid> </Grid>
public partial class MainPage : PhoneApplicationPage { // Constructor public MainPage() { InitializeComponent(); List<string> items = new List<string>(); items.Add("item1"); items.Add("item2"); items.Add("item3"); items.Add("item4"); items.Add("item5"); listbox.ItemsSource = items; } }
>你上面给我的例子应该 就是我说的 toolkit中的TiltEffect效果, 但是下载到的源码中只有一个TiltEffect文件,且没有后缀,打开看着像个网页,不知道怎么回事
解压后打开文件夹,你会发现有TiltEffect文件夹和TiltEffect.sln文件,open with Microsoft Visual Studio 2010 或Microsoft Expression Blend 4就能打开该程序了。
希望有所帮助。
-
出现这样效果的原因是你将改变颜色和字体大小的Animation放在<VisualState x:Name="MouseOver">里,当鼠标滑过出现动画。可以尝试将它们放到<VisualState x:Name="Selected">里,当某一item被选择时颜色和字体大小改变;但此时鼠标移开时,item不会变回原状。
<VisualStateGroup x:Name="SelectionStates"> <VisualState x:Name="Unselected"/> <VisualState x:Name="Selected"> <Storyboard> <ColorAnimation Duration="0" To="#FFEF5858" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/> <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(TextBlock.FontSize)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/> </Storyboard> </VisualState> </VisualStateGroup>
如果你要实现TiltEffect类似的效果,可以参考上面链接中的例子定义一个DependencyProperty,定义全局的效果。有关依赖属性的更多信息,请参考:
http://msdn.microsoft.com/zh-cn/library/cc221408(v=vs.95).aspx
希望能帮助到你。
- 已编辑 Haixia_XieModerator 2012年5月17日 9:27
- 已标记为答案 Haixia_XieModerator 2012年5月22日 6:33
-
找不到Title1是因为Storyboard1和Textblock(Title1)在不同的namespace里。可以尝试在后台代码中定义StoryBoard,然后在Title1_ManipulationStarted方法里设置或更改其TargetName。
参考下面链接中的例子在后台定义storyboard。
- 已标记为答案 Haixia_XieModerator 2012年5月22日 6:33