question

BitSmithy-4663 avatar image
0 Votes"
BitSmithy-4663 asked ·

Removing From ListView ItemTemplate

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.


windows-uwp
· 4
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

sorry I pasted not full question text. Full question below:


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.


0 Votes 0 ·

sorry I pasted not full question text. Full question below:


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.


0 Votes 0 ·

Something removes my XAML Code from the post


0 Votes 0 ·

It's a known issue that currently Microsoft Q&A can't post Xaml code. Please refer to this post: Can not insert XML/XAML Code in Post for a workaround.

Then share the Xaml code with me so that I could take a look at your issue.


0 Votes 0 ·
BitSmithy-4663 avatar image
0 Votes"
BitSmithy-4663 answered ·

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>
· 3 ·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Another question here. Do you want to remove the button for a specific row or you want to remove the button for all the rows? If you want to remove the button for all the rows, why you add it to the Datatemplate?

0 Votes 0 ·

I want to remove it for all rows. I want to remove it because in common I use it, but there is any scenario when I don't want to see it. Button is joined with some FlayoutMenus these FlayoutMenus are set with converters, The easiest way is to remove the button, in such case converters wont be triggered.
If i simply make button invisible, I am afraid of that converters will work, and it lowers execution time.

So if there is a method to remove button from DataTemplate please tell me how to do it.

0 Votes 0 ·

If you want to control the visibility of the button, you could check @MartinAF's answer about it. He shows how to find the button.

0 Votes 0 ·
RoyLi-MSFT avatar image
0 Votes"
RoyLi-MSFT answered ·

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.



· 1 ·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

This solution is ok as a walktrought but it has two weakness:
1. In this solution button is invisible, but ListViewItem reserves width for it. This damages layout.
2. Button is generated by every row, this influence performance.
Probably better is DataTemplate selector for list view item.

0 Votes 0 ·
MartinAF avatar image
0 Votes"
MartinAF answered ·

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;
         }
     }






· 3 ·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

This solution needs to first populate list with data, and next remove buttons.
I want to do otherwise first remove button from ListViewItem DataTemplate, and next populate list with data. It is for better performance.

0 Votes 0 ·

It doesn't make sense. If you want to remove this before you populate list with data, why you add the button to the DataTemplate? This is contradictory.

A easier way is to create different DataTemplates and use different DataTemplates for different data when populating the listview with data. DataTemplateSelector would be more suitable.

0 Votes 0 ·

A easier way is to create different DataTemplates and use different DataTemplates for different data when populating the listview with data. DataTemplateSelector would be more suitable.



I didint want to use this method because here some coding is needed.
But if there is no method to simply delete column from DataTemplate it is the best way.


0 Votes 0 ·