How to show a button only when a Silverlight DataGrid row is selected

Question

How can I display a button in a DataGridTemplateColumn only when its row is selected? I've tried this, but of course there is no IsSelected available to me. It doesn't make sense to have an IsSelected property on the entity to which the rows are bound, and even so I wouldn't want to have to couple my DataGrid to my model that tightly. Is there anyway that the interface can handle this itself?

This is what I have:

<sdk:DataGrid Name="_categorySummaryDataGrid" 
              MinHeight="200" 
              ItemsSource="{Binding ElementName=_userControl, Path=CategorySummaries}"
              AutoGenerateColumns="False" RowDetailsVisibilityMode="VisibleWhenSelected">
    <sdk:DataGrid.Columns>
        <sdk:DataGridTextColumn x:Name="_nameColumn" Binding="{Binding Path=Name}" Header="Name" Width="Auto" IsReadOnly="True" />
        <sdk:DataGridTextColumn x:Name="_descriptionColumn" Binding="{Binding Path=Description}" Header="Description" Width="*" IsReadOnly="True" />
        <sdk:DataGridTemplateColumn x:Name="_detailsColumn" Width="Auto">
            <sdk:DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <Button Content="..." ToolTipService.ToolTip="View Category Details" 
                            Visibility="{Binding Path=IsSelected, Converter={StaticResource BooleanToVisibility}}"/>
                </DataTemplate>
            </sdk:DataGridTemplateColumn.CellTemplate>
        </sdk:DataGridTemplateColumn>
    </sdk:DataGrid.Columns>
</sdk:DataGrid>

For design reasons, I want the button to only show when the row that contains it is selected. And, if possible, I want it to show in a different way when the row is being hovered over.

There seem to be more limitations to Silverlight and WPF that I had hoped. I hope that these things are possible. Thanks. :)

Edit:

I do not have, and will not be getting Expression Blend. Thank you, that is all.

Answer 1

Whenever you want to change the visual appearance of anything in Silverlight, you have to think in terms of VisualStateManager. To change the appearance of a Selected DataGrid cell, you'll need to avail yourself to the wonders of VSM. By editing DataGridColumn.CellStyle's "Selected" state you can change the appearance of the selected grid cell.

1. In Blend, drag and drop a new DataGrid on a Page.
2. Right click on the DataGrid and choose "Add Column --> Add DataGridTemplateColumn"
3. Right click on the DataGridTemplateColumn in the "Object and timeline" pane and go "Edit Column Styles --> Edit CellStyle --> Edit Copy"
4. Right click on "Style" in the "objects and timeline" pane and go "Edit Template --> Edit Current".
5. Now comes the interesting part, how to specifically solve the problem of a disappearing button. If the button is the only thing you've got in that CellTemplate then you can just hide the whole contents of the cell.
6. Select the "Selected" state from the "States" pane.
7. Set the visibility of the ContentPresenter in the CellStyle.Template to Collapsed. (A nicer UX would be to add a 0.3seconds animation taking opacity from 100% to 0%).

Essentially this whole tutorial is about getting to the CellStyle.Template for your DataGridColumn and adding an animation to the Selected State.