Removing From ListView ItemTemplate

BitSmithy 1,751 Reputation points
2020-01-12T22:26:12.877+00:00

Hello,

I have a ListView defined as:

Now I want to Remove from ItemTemplate Button. I want to do this code behind.

Tried to do this with code:
ElementFactoryGetArgs efga = new ElementFactoryGetArgs();
Grid g = (Grid)lvProjects.ItemTemplate.GetElement(efga);
g.Children.RemoveAt(1);

But I failed. Please answer how to remove button from the ItemTemplate code behind.

Universal Windows Platform (UWP)
{count} votes

3 answers

Sort by: Most helpful
  1. BitSmithy 1,751 Reputation points
    2020-01-13T21:22:51.15+00:00

    XAML:

        <ListView x:Name="lvProjects" x:Uid="lvProjects" Margin="0,10,20,0" Foreground="Blue"
                        >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"></ColumnDefinition>
                            <ColumnDefinition Width="31"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
    
                        <TextBox x:Name="tbxProjectName" Text="{Binding showedName, UpdateSourceTrigger=Explicit, Mode=TwoWay}"                                                                                                                  
                                 Grid.Column="0" HorizontalAlignment ="Stretch" BorderThickness="0"                                  >
                        </TextBox>
    
                        <Button x:Name="btnProjectItemButton" Content=".." Grid.Column="1" HorizontalAlignment="Right" Margin="5,0,0,0"                                                                                        
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    

  2. Roy Li - MSFT 31,786 Reputation points Microsoft Vendor
    2020-01-14T03:26:00.72+00:00

    Hello,

    Welcome to Microsoft Q&A!

    Based on your scenario, you don't need to remove the button from the template. My suggestion is you could just change the visibility of the button to achieve the same behavior- make the button disappear. This will also be more easy to control in case you want to bring the button back.

    To reach this goal, you will need to implement the INotifyPropertyChanged interface and add a new bool property in the data model. Like the following code:

    public class Test :INotifyPropertyChanged  
        {  
      
            private string _showedName { get; set; }  
      
            private bool _buttonVisibility { get; set; }  
      
            public string showedName  
            {  
                get { return _showedName; }  
                set  
                {  
                    _showedName = value;  
                    RaisePropertyChanged("showedName");  
                }  
            }  
      
            public bool buttonVisibility   
            {  
                get { return _buttonVisibility; }  
                set  
                {  
                    _buttonVisibility = value;  
                    RaisePropertyChanged("buttonVisibility");  
                }  
            }  
      
      
            public event PropertyChangedEventHandler PropertyChanged;  
      
              
            protected void RaisePropertyChanged(string name)  
            {  
                if (PropertyChanged != null)  
                {  
                    PropertyChanged(this, new PropertyChangedEventArgs(name));  
                }  
            }  
        }  
    

    And in the Xaml, you need to bind the visibility property.

    TextBox x:Name="tbxProjectName" Text="{Binding showedName, UpdateSourceTrigger=Explicit,Mode=TwoWay}" Grid.Column="0" HorizontalAlignment ="Stretch" BorderThickness="0"  
    Button x:Name="btnProjectItemButton" Content=".." Grid.Column="1" HorizontalAlignment="Right" Margin="5,0,0,0" Visibility="{Binding buttonVisibility,Mode=TwoWay}"  
    

    After that, when you change the bool value of the data model, the button will disappear.


  3. Martin-AF 1 Reputation point
    2020-01-14T03:29:00.733+00:00

    Get the ListviewItem first using Listview.ContainerFromItem(Object). Then you can get the button by going through all the child elements using VisualTreeHelper. Finally you could remove the button as you want.
    See the code below

    //ListviewItem is the row where you want to remove the button. Get the object using  Listview.ContainerFromItem(Object)
       int count = VisualTreeHelper.GetChildrenCount( ListViewItem );
        for( int i = 0; i < count; i++ )
        {
            UIElement child = ( UIElement )VisualTreeHelper.GetChild( parent, i );
    
            if( FindControl( child, ControlName ) != null )
            {
                result = FindControl( child, ControlName );
                break;
            }
        }