In WPF, when creating an object as a resource, how can you "bind" to a generic property?

Question

I have a "Busy" indicator that looks (and works) like so:

<Grid x:Key="BusyIndicator" Visibility="Hidden" Opacity="0">
        <Grid.Style>
            <Style TargetType="{x:Type Grid}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Path = IsBusy}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard Storyboard="{StaticResource FadeInStoryboard}"/>
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <BeginStoryboard Storyboard="{StaticResource FadeOutStoryboard}"/>
                        </DataTrigger.ExitActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Style>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Border Background="#90000000">
            <Image Width="25" Height="25" RenderTransformOrigin="0.5, 0.5">
                <Image.Source>
                    <BitmapImage UriSource="busy.png"/>
                </Image.Source>
                <Image.RenderTransform>
                    <RotateTransform Angle="0" />
                </Image.RenderTransform>
                <Image.Style>
                    <Style TargetType="{x:Type Image}">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding Path = IsBusy}" Value="True">
                                <DataTrigger.EnterActions>
                                    <BeginStoryboard Storyboard="{StaticResource RotateStoryboard}"/>
                                </DataTrigger.EnterActions>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Image.Style>
            </Image>
        </Border>
    </Grid>

As you can see, the indicator is a grid that's "Hidden" and "Invisible", when the "IsBusy" property changes, the grid fades in, and reveals a rotating "busy.png" image. When the "IsBusy" toggles off, the indicator fades to "Invisible" again, and disappears.

This all works.

What I can't seem to wrap my head around, is how do I make this control a resource in the App.xaml to be reused throughout the application? Because it's bound to the IsBusy property, I find myself having to cut and paste this monstrosity into every page that needs to use the indicator.

Is there a way to get the same effect, but with a reusable resource?

Edit:

So it really was as simple as stuffing it into a UserControl. Spent so much time trying to find the "WPF" solution, I forgot the basics. As ASh said, by simply adding a dependency property in the code-behind, using the control in a page now looks like this:

<local:BusyIndicator IsBusy="{Binding Path=IsBusy}"/>

looks like custom UserControl (e.g. BusyIndicator) with dependency property "IsBusy" will be the simplest solution in this case. Then you just insert `` in xaml and won't have to work with resources — ASh, Nov 02 '17 at 15:27
You can't reuse the same DataTrigger in another style and just change the path of the binding. You will have to re-define the entire trigger. — mm8, Nov 02 '17 at 15:28
ASh: Can you post this as an answer? (I'm new to SO.) I believe this is the correct answer. — Javin Bond, Nov 02 '17 at 15:31

score 0 · Accepted Answer · answered Nov 02 '17 at 15:48

Looks like custom UserControl (e.g. named "BusyIndicator") with bool dependency property "IsBusy" will be the simplest solution in this case. Then you just insert <BusyIndicator/> in xaml and bind IsBusy attribute to some property in a view model (not necessary named "IsBusy"): <BusyIndicator IsBusy="{Binding Path=IsBusyViewModelProperty}"/> - and easily customize any other property

This post might help you to implement a usercontrol from existing resource

In WPF, when creating an object as a resource, how can you "bind" to a generic property?

Edit:

1 Answers1