Search code examples
c#wpfheightlistviewitem

C# Wpf How to Change Listviewitem's Height Using a Button in it?


I have listview items that contains 1 button in it. Listview item's default height is 60.

When i click listview item's button, that row(contains the button clicked)'s height should change to 100. When i click that button again row's height should change back to 60.

I'm really can't find out how to implement this.

enter image description here When i click Row1's details button, Row1's height should change to 100. If i click it again it's heigth should change back to 60.

I'm adding buttons to listview items like this :

                 <GridViewColumn >
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <Grid>                                  
                               <ButtonName="DetailsButton"Content="Details"FontWeight="Bold"  HorizontalAlignment="Left" Margin="520,35,0,0" VerticalAlignment="Top" Width="75" Height="25">
                               </Button>
                            </Grid>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>

Solution

  • you may use DataTemplate Triggers to achieve the same

    sample

    <GridViewColumn>
        <GridViewColumn.CellTemplate>
            <DataTemplate>
                <Grid>
                    <ToggleButton Name="DetailsButton"
                                  Content="Details"
                                  FontWeight="Bold"
                                  HorizontalAlignment="Left"
                                  Margin="520,35,0,0"
                                  VerticalAlignment="Top"
                                  Width="75"
                                  Height="25">
                    </ToggleButton>
                </Grid>
                <DataTemplate.Triggers>
                    <Trigger SourceName="DetailsButton"
                             Property="IsChecked"
                             Value="true">
                        <Setter Property="Height"
                                Value="100" />
                    </Trigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </GridViewColumn.CellTemplate>
    </GridViewColumn>
    

    I have changed Button to a ToggleButton so it can have two states and also shows clear indications.

    in the trigger i have set the height to 100 when the button is checked. and it will be reverted back once the condition become false

    see if this is what you are looking for.