|
Hello.
I have several hundred buttons that need the same animation applied on mouse enter, in AS3 I'd do this with a tween and apply that tween using e.currentTarget, probably inside a for loop. Is there a way to do this in WPF, have a storyboard for no specific object be applied to an array of items?
Regards.
E.
|
|
|
|
|
This is trivial in WPF. All you need do is declare a storyboard inside a trigger that applys to the button type. Here's a simple example:
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Page.Resources>
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity" To="0.20" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
</Style.Triggers>
</Style>
</Page.Resources>
<StackPanel>
<Button Content="Hello" />
<Button Content="Hello 2" />
</StackPanel>
</Page>
"WPF has many lovers. It's a veritable porn star!" - Josh Smith As Braveheart once said, "You can take our freedom but you'll never take our Hobnobs!" - Martin Hughes.
My blog | My articles | MoXAML PowerToys | Onyx
|
|
|
|
|
Hello.
Thank you for that, it makes sense. Can that method be used for DoubleAnimationUsingKeyframes however, as the animations need to be more complex than I'd be happy to try and code so will create them in Blend on a proxy object. When attempting this I get:
[unknown]property does not point to a dependency object in path"(0).(1).[2].(2);"
|
|
|
|
|
Certainly. Here's this sample modified:
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Page.Resources>
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity">
<LinearDoubleKeyFrame Value="0.6" KeyTime="0:0:0.5" />
<DiscreteDoubleKeyFrame Value="0.2" KeyTime="0:0:1" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Duration="0:0:0.5" Storyboard.TargetProperty="Opacity" To="1"/>
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
</Style.Triggers>
</Style>
</Page.Resources>
<StackPanel>
<Button Content="Hello"/>
<Button Content="Hello 2"/>
</StackPanel>
</Page>
"WPF has many lovers. It's a veritable porn star!" - Josh Smith As Braveheart once said, "You can take our freedom but you'll never take our Hobnobs!" - Martin Hughes.
My blog | My articles | MoXAML PowerToys | Onyx
|
|
|
|
|
I have the following collection:
public class WorkTrayItem
{
public TabItem WindowAccountTab { get; set; }
public string WindowSource { get; set; }
public Window WindowObject { get; set; }
public Image WindowIcon { get; set; }
public int WindowType { get; set; }
public string WindowName { get; set; }
public WorkTrayItem(TabItem tab, Window window, string source, int windowType, Image icon)
{
WindowObject = window;
WindowSource = source;
WindowAccountTab = tab;
WindowType = windowType;
WindowIcon = icon;
switch (windowType)
{
case 0 : WindowName = "Service Order"; break;
case 1 : WindowName = "Trouble Ticket"; break;
}
}
}
public class WorkTrayItems : ObservableCollection<worktrayitem>
{
public WorkTrayItems()
{
this.Clear();
}
}
I'm trying to bind it to a list view:
<UserControl.Resources>
<controls:WorkTrayItems x:Key="WorkTrayData" />
<Style TargetType="{x:Type ListView}" BasedOn="{StaticResource {x:Type ListBox}}">
<Setter Property="ItemsSource" Value="{Binding Source={StaticResource WorkTrayData}}">
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border Name="bd" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
Margin="{TemplateBinding Margin}">
<ScrollViewer Margin="{TemplateBinding Padding}">
<WrapPanel ItemWidth="150" IsItemsHost="True" Name="wrapPanel1" MinWidth="100"
Width="{Binding ActualWidth,
RelativeSource={RelativeSource Mode=FindAncestor,
AncestorType=ScrollContentPresenter}}">
</WrapPanel>
</ScrollViewer>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType='{x:Type ListViewItem}' BasedOn='{StaticResource {x:Type ListBoxItem}}'>
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel Orientation="Vertical">
<StackPanel.DataContext>
<Binding Source="{StaticResource WorkTrayData}" />
</StackPanel.DataContext>
<Image Margin="3" Source="{Binding WindowImage}"/>
<Label Height="21" HorizontalContentAlignment="Center"
VerticalContentAlignment="Top"
Content="{Binding WindowTitle}"/>
<Label Height="21" HorizontalContentAlignment="Center"
VerticalContentAlignment="Top"
Content="{Binding WindowSource}"/>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{ComponentResourceKey TypeInTargetAssembly={x:Type controls:ImageView},ResourceId=ImageView}">
</Style>
<Style x:Key="{ComponentResourceKey TypeInTargetAssembly={x:Type controls:ImageView},ResourceId=ImageViewItem}">
</Style>
</UserControl.Resources>
<Grid>
<ListView Name="listViewWorkTray"
Margin="8,0,7,-116" BorderThickness="0" Background="Transparent"
SelectionMode="Single" FontFamily="Arial" Height="109"
VerticalAlignment="Bottom">
<ListView.View>
<controls:ImageView />
</ListView.View>
</ListView>
</Grid>
When a user opens a window, I add a WorkTrayItem object to the collection, but it doesn't show up in the ListView. What am I missing? Somehow, I feel like I need to tell the XAML what the variable name is of the list in the parent control (m_workTrayData), but how/where should I do that?
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
modified on Friday, April 24, 2009 8:05 AM
|
|
|
|
|
So who voted my message a 1, and why? Was it too close to actual programming?
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
If you're setting the binding context of the window, or the control, then you don't need to tell anything the variable name, it's already there in the binding context. I am surprised that you can create an observable collection with so little code, all the examples I have seen, use more. Does the base class provide the rest ? I assume it's not strongly typed then, strong typing is, I am pretty sure, what the extra code I've seen adds to the equation.
Christian Graus
Driven to the arms of OSX by Vista.
"I am new to programming world. I have been learning c# for about past four weeks. I am quite acquainted with the fundamentals of c#. Now I have to work on a project which converts given flat files to XML using the XML serialization method" - SK64 ( but the forums have stuff like this posted every day )
|
|
|
|
|
Christian Graus wrote: I am surprised that you can create an observable collection with so little code, all the examples I have seen, use more.
I'm a minimalist by nature. Remember - I started programming when having 4K of RAM was considered "downtown".
Christian Graus wrote: If you're setting the binding context of the window, or the control, then you don't need to tell anything the variable name, it's already there in the binding context.
But how can it know if I don't tell it what data member to use?
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
OK, then I guess this is the issue. You have to set the DataContext of the control or the page ( depending on the XAML, I believe ) to be that list. I am not sure, but I think if you set the data context of the page ( which can be done in the XAML ) then the control will 'inherit' it.
I've just checked my code, and I tend to do it in the code, not the XAML.
playlists.DataContext = Playlists.GetFilesNotIn(list);
sets the data context of a control to a list of objects. I use an observable collection elsewhere, but the code is the same.
Christian Graus
Driven to the arms of OSX by Vista.
"I am new to programming world. I have been learning c# for about past four weeks. I am quite acquainted with the fundamentals of c#. Now I have to work on a project which converts given flat files to XML using the XML serialization method" - SK64 ( but the forums have stuff like this posted every day )
|
|
|
|
|
Christian Graus wrote: strong typing is, I am pretty sure, what the extra code I've seen adds to the equation
What advantage does that have over ObservableCollection<T> ?
This seems pretty simple to me:
public class MyItemCollection : ObservableCollection<Item>
{
}
Mark
Mark Salsbery
Microsoft MVP - Visual C++
![Java | [Coffee]](https://www.codeproject.com/script/Forums/Images/coffee.gif)
|
|
|
|
|
Christian Graus wrote: I am surprised that you can create an observable collection with so little code, all the examples I have seen, use more.
I now realize what you're talking about. The auto-encode stuff ignored the type specifier after the word ObservableCollection.
I fixed it.
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
Well, I moved the DataContext assignment into the code instead of the XAML, and I also noticed that ALL of my field names were incorrect, but even after fixing them, I get nothing in my listview (even though the collection contains items, and I've verified this through the debugger).
I haven't got a clue as to why the items aren't showing up.
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
John Simmons / outlaw programmer wrote: I moved the DataContext assignment into the code
Which element's DataContext are you assigning to?
I also can't see where you are binding your ListView's ItemsSource
(maybe I missed it)...
Mark Salsbery
Microsoft MVP - Visual C++
![Java | [Coffee]](https://codeproject.global.ssl.fastly.net/script/Forums/Images/coffee.gif)
|
|
|
|
|
I'm assigning the collection to the listview's datacontext like so:
m_workTrayData = new UDPWorkTrayItems();
this.listViewWorkTray.DataContext = m_workTrayData;
The ItemsSource is being set like so:
<Setter Property="ItemsSource" Value="{Binding Source={StaticResource WorkTrayData}}" ></Setter>
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
Two different source collections?
If you want to keep the
m_workTrayData = new UDPWorkTrayItems();
this.listViewWorkTray.DataContext = m_workTrayData;
then the ItemsSource binding should be
<Setter Property="ItemsSource" Value="{Binding}" />
and m_workTrayData will be the collection bound to the ListView.
If you want to use the collection object defined in XAML ("WorkTrayData")
then your binding sould be fine, but WorkTrayData is the collection you want to
add objects to.
Here's a quick and dirty way to check if your ItemsSource is bound correctly
(note I used WindowTitle and WindowSource - adjust for actual property names) :
m_workTrayData = new UDPWorkTrayItems();
this.listViewWorkTray.DataContext = m_workTrayData;
<Window.Resources>
<Style TargetType="{x:Type ListView}" >
<Setter Property="ItemsSource" Value="{Binding}" />
</Style>
</Window.Resources>
...
<Grid>
<ListView Name="listViewWorkTray">
<ListView.View>
<GridView>
<GridViewColumn Header="WindowTitle" Width="100" DisplayMemberBinding="{Binding Path=WindowTitle}"></GridViewColumn>
<GridViewColumn Header="WindowSource" Width="100" DisplayMemberBinding="{Binding Path=WindowSource}"></GridViewColumn>
</GridView>
</ListView.View>
</ListView>
</Grid>
That should show you if your collection is bound correctly.
Mark Salsbery
Microsoft MVP - Visual C++
modified on Friday, April 24, 2009 4:59 PM
|
|
|
|
|
Mark Salsbery wrote: If you want to keep the
m_workTrayData = new UDPWorkTrayItems();
this.listViewWorkTray.DataContext = m_workTrayData;
then the ItemsSource binding should be
<setter property="ItemsSource" value="{Binding}">
That was the answer.  It's now displaying the text part. The image isn't showing. Should I be using a Converter even if the Image in the WorkTrayItem is an actual Image object that I'm retrieving from the window object? I'm off to search google, and I'll be checking back frequently to see if you've responded (or to post my success/failures).
Many thanks for your help on this.
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
You don't need a converter if the property binded to is the right type.
In WPF, "Image" is a UIElement, not the actual image data.
For binding to Image.Source, the bound-to type should be System.Windows.Media.ImageSource
(or derived).
Here's an example, using an imagesource for a JPEG image added to the project
as a resource:
public class WorkTrayItem
{
public ImageSource WindowImage { get; set; }
public WorkTrayItem(...)
{
WindowImage = new BitmapImage(new Uri(@"pack://application:,,,/Images/someimageresource.jpg", UriKind.RelativeOrAbsolute));
}
}
Now, in your template, if you bind your Image.Source to WindowImage
<Image Margin="3" Source="{Binding WindowImage}"/>
you should see your image.
Mark Salsbery
Microsoft MVP - Visual C++
|
|
|
|
|
Hi.
I'm going to create a ListView template. But when I've done it , I can't add items into the ListView !!!
I think , I don't do in correct way.
Could you guide me , how we can create a template for a ListView ?
Thanks.
|
|
|
|
|
Can you post a simple example of your ListView and template code?
And how are you trying to add items?
Mark
Mark Salsbery
Microsoft MVP - Visual C++
|
|
|
|
|
Mark Salsbery wrote: Can you post a simple example of your ListView and template code?
Sure. this is the XAML of my template :
<ControlTemplate x:Key=<span style="color:#A31515;">"ListViewTemplate"</span> TargetType=<span style="color:#A31515;">"{x:Type ListView}"</span>>
<StackPanel Orientation=<span style="color:#A31515;">"Horizontal"</span>>
<StackPanel>
<GridViewColumnHeader Content=<span style="color:#A31515;">"Icon"</span> x:Name=<span style="color:#A31515;">"Icon"</span> MinWidth=<span style="color:#A31515;">"34"</span>/>
<ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
</StackPanel>
<StackPanel>
<GridViewColumnHeader Content=<span style="color:#A31515;">"Title"</span> x:Name=<span style="color:#A31515;">"Title"</span> MinWidth=<span style="color:#A31515;">"85"</span>/>
<ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
</StackPanel>
<StackPanel>
<GridViewColumnHeader Content=<span style="color:#A31515;">"Username"</span> x:Name=<span style="color:#A31515;">"Username"</span> MinWidth=<span style="color:#A31515;">"80"</span>/>
<ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
</StackPanel>
<StackPanel>
<GridViewColumnHeader Content=<span style="color:#A31515;">"Password"</span> x:Name=<span style="color:#A31515;">"Password"</span> MinWidth=<span style="color:#A31515;">"80"</span>/>
<ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
</StackPanel>
<StackPanel>
<GridViewColumnHeader Content=<span style="color:#A31515;">"URL"</span> x:Name=<span style="color:#A31515;">"url"</span> MinWidth=<span style="color:#A31515;">"160"</span>/>
<ListViewItem Content=<span style="color:#A31515;">"item"</span>/>
</StackPanel>
</StackPanel>
</ControlTemplate>
Mark Salsbery wrote: And how are you trying to add items?
listview.Items.Add("an item");
|
|
|
|
|
Your template doesn't have a place to display the added items.
Maybe try something like this:
<ListView Name="listview" >
<ListView.View>
<GridView AllowsColumnReorder="False" >
<GridViewColumn Header="Icon" Width="34" ></GridViewColumn> <!--DisplayMemberBinding="{Binding Path=...}"-->
<GridViewColumn Header="Title" Width="85" ></GridViewColumn>
<GridViewColumn Header="Username" Width="80" ></GridViewColumn>
<GridViewColumn Header="Password" Width="80" ></GridViewColumn>
<GridViewColumn Header="URL" Width="160" ></GridViewColumn>
</GridView>
</ListView.View>
</ListView>
Mark Salsbery
Microsoft MVP - Visual C++
|
|
|
|
|
Thanks Mark, but we can't use ListView tag within ControlTemplate tag !!!
Isn't it ?
|
|
|
|
|
the items presenter to show the items.
Here's a default template for a ListView you can use as a starting place:
<SolidColorBrush x:Key="ListBorder" Color="#828790"/>
<Style x:Key="ListViewStyle1" TargetType="{x:Type ListView}">
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
<Setter Property="BorderBrush" Value="{StaticResource ListBorder}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListView}">
<Border x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="1">
<ScrollViewer Padding="{TemplateBinding Padding}" Focusable="false">
<ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
</ScrollViewer>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
</Trigger>
<Trigger Property="IsGrouping" Value="true">
<Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Mark Salsbery
Microsoft MVP - Visual C++
|
|
|
|
|
The link wasn't helpful .
I've used ItemsPresenter
|
|
|
|
|
i have a problem with binden 2 controls. one is in the headertemplate and the other one is in the celltemplate. as you can see i have a checkbox(x:Name="chboCheckAll") in my headertemplate and the other checkbox is in the celltemplate(x:Name="chboCheckOld"). what i want is that when i check the checkbox in my headertemplate the checkbox in my celltemplate gets update with the value in the headertemplate. how can i achieve this?? thank you for the help
<my:DataGridTemplateColumn>
<my:DataGridTemplateColumn.HeaderTemplate >
<DataTemplate>
<Border x:Name="border">
<Grid x:Name="grid">
<CheckBox x:Name="chboCheckAll" Grid.Column="1" IsChecked="True"></CheckBox>
</Grid>
</Border>
</DataTemplate>
</my:DataGridTemplateColumn.HeaderTemplate>
<my:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<CheckBox x:Name="chboCheckOld" Content="{Binding Path=Old}" IsChecked="{Binding ElementName=chboCheckAll, Path=IsChecked}></CheckBox>
</StackPanel>
</DataTemplate>
</my:DataGridTemplateColumn.CellTemplate>
</my:DataGridTemplateColumn>
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
