ListView / ListBox: Insert single special data into them
Hi all, thanks for looking through my previous questions and answer it! (*Updated progress in next reply, most are solved)
I am currently working on creating a player scoreboard scroll box without header, which format will look like this:
Player(align to left) Score(align to right)
The background will need alternating two colours as background (see the attached image). I wonder if you can advice me on how to efficiently achieve this format.
I have tried ListBox and ListView. I am not sure which is better. When I use Grid View for ListView, it will force me to have a header too. So I add an extra content presenter to the default ListView Item container, but I am not sure if this is the right way of doing it. I also try editing the content presenter template so it will contain 2 information from the single content presenter. Again I am not sure if it is the best way to do it, as I am following your Character Selection tutorial and somehow apply the same technique to the ListView. Or should I use ListBox instead of ListView? Should I use ListBox when the item is not selectable? (But the future may change, is there a way to make the list flexible around selectable and not selectable?)
Both have the same issues :
1. Item container Template overriding Styles, which make Styles cannot colour the background of ListView or ListBox.
2. Cannot add value in the AlternationConverter - no matter when it is converted to resources, or underneath a local value, which mean I can't assign brush colour onto it
3. I try copy the code from the screenshot attached and paste it to my xaml, it did somehow work. The colour is appearing in alternation converter and it seems it was binding to the background in Style. However, it is not reflecting to the ListView? I think this is the same issue with issue 1.
I would like to know how to customise the scroll bar as well. And for the scoreboard I want to highlight the player row (so player can easily see where they are at), is it possible to have one unique item being displayed along with other formatted player name? Hope I am making sense, appreciate for all of your help!
I am currently working on creating a player scoreboard scroll box without header, which format will look like this:
Player(align to left) Score(align to right)
The background will need alternating two colours as background (see the attached image). I wonder if you can advice me on how to efficiently achieve this format.
I have tried ListBox and ListView. I am not sure which is better. When I use Grid View for ListView, it will force me to have a header too. So I add an extra content presenter to the default ListView Item container, but I am not sure if this is the right way of doing it. I also try editing the content presenter template so it will contain 2 information from the single content presenter. Again I am not sure if it is the best way to do it, as I am following your Character Selection tutorial and somehow apply the same technique to the ListView. Or should I use ListBox instead of ListView? Should I use ListBox when the item is not selectable? (But the future may change, is there a way to make the list flexible around selectable and not selectable?)
Both have the same issues :
1. Item container Template overriding Styles, which make Styles cannot colour the background of ListView or ListBox.
2. Cannot add value in the AlternationConverter - no matter when it is converted to resources, or underneath a local value, which mean I can't assign brush colour onto it
3. I try copy the code from the screenshot attached and paste it to my xaml, it did somehow work. The colour is appearing in alternation converter and it seems it was binding to the background in Style. However, it is not reflecting to the ListView? I think this is the same issue with issue 1.
I would like to know how to customise the scroll bar as well. And for the scoreboard I want to highlight the player row (so player can easily see where they are at), is it possible to have one unique item being displayed along with other formatted player name? Hope I am making sense, appreciate for all of your help!
Re: ListView / ListBox: Insert single special data into them
Hi all,
I spend a whole day struggling and reading stackoverflow, I somehow solve most of the problem visually and make them work! However I wonder if the way I am doing it will have performance trade-off, so I am going to attach the MainPage zip down and hopefully it looks alright! And also will appreciate if you can help with inserting one special data that only appear once in listview, but display along with other data. (Use case: highlight player on the scoreboard)
Many thanks!
I spend a whole day struggling and reading stackoverflow, I somehow solve most of the problem visually and make them work! However I wonder if the way I am doing it will have performance trade-off, so I am going to attach the MainPage zip down and hopefully it looks alright! And also will appreciate if you can help with inserting one special data that only appear once in listview, but display along with other data. (Use case: highlight player on the scoreboard)
Many thanks!
- Attachments
-
- MainPage.zip
- (1.88 KiB) Downloaded 562 times
-
- JoshCampbell_LuckyVR
- Posts: 2
- Joined:
Re: ListView / ListBox: Insert single special data into them
We've done something similar on our project. The approach we went with was to set up a Data Template Selector that selects a different template based on a data trigger that binds to a bool in our view model's item data. On startup we check if the entry is the first in the list and set the "IsFirstItem" value to true. Hope that helps.
-
-
sfernandez
Site Admin
- Posts: 3363
- Joined:
Re: ListView / ListBox: Insert single special data into them
Hello,
If you don't need selection the most efficient control to present a list of items will be an ItemsControl. That way you only need to specify the ItemTemplate.
And for the alternating background colors you will use the AlternationCount and AlternationIndex properties:
If you don't need selection the most efficient control to present a list of items will be an ItemsControl. That way you only need to specify the ItemTemplate.
And for the alternating background colors you will use the AlternationCount and AlternationIndex properties:
Code: Select all
<ItemsControl ItemsSource="{Binding PlayerData}" AlternationCount="2">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border x:Name="bd">...</Border>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource AncestorType=ContentPresenter}}" Value="0">
<Setter TargetName="bd" Property="Background" Value="Red"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource AncestorType=ContentPresenter}}" Value="1">
<Setter TargetName="bd" Property="Background" Value="Blue"/>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>Re: ListView / ListBox: Insert single special data into them
Hi JoshCampbell_LuckyVR,
Thanks for the solution! It sounds like that will be something that requires editing xaml directly, I will bring this up with the coding team! :D Really appreciate it!
Thanks for the solution! It sounds like that will be something that requires editing xaml directly, I will bring this up with the coding team! :D Really appreciate it!
Re: ListView / ListBox: Insert single special data into them
Hi sfernandez,
Thanks for the code and suggestion on the most efficient option! Guessing from your reply, does that mean that the less template used by a specific element, the more efficient they will be? For example, efficiency (from the best to worst) will be like: ItemsControl>ListView>ListBox, of course they have different functions so we can't compare them directly, but is that a general rule in terms of efficiency? How about style? Will style also affect efficiency too?
In terms of the coding - As I never learn xaml before, I really didn't know where and how to use the code...? I tried to put it in the line that I feel like it is, but it shows me 'Cannot convert '...' into a 'Border' object' and 'Duplicate assignment of property Border'. I also try to follow the code and use studio tool to replicate it, but I don't really know how it works except I can change the alternation count to 2 in the parent ItemControl/ ListView/ ListBox. I wonder if there is anyway to do it with Studio tool directly?
Thanks for the code and suggestion on the most efficient option! Guessing from your reply, does that mean that the less template used by a specific element, the more efficient they will be? For example, efficiency (from the best to worst) will be like: ItemsControl>ListView>ListBox, of course they have different functions so we can't compare them directly, but is that a general rule in terms of efficiency? How about style? Will style also affect efficiency too?
In terms of the coding - As I never learn xaml before, I really didn't know where and how to use the code...? I tried to put it in the line that I feel like it is, but it shows me 'Cannot convert '...' into a 'Border' object' and 'Duplicate assignment of property Border'. I also try to follow the code and use studio tool to replicate it, but I don't really know how it works except I can change the alternation count to 2 in the parent ItemControl/ ListView/ ListBox. I wonder if there is anyway to do it with Studio tool directly?
-
-
sfernandez
Site Admin
- Posts: 3363
- Joined:
Re: ListView / ListBox: Insert single special data into them
The simpler the template the better (less UI elements will be created and rendered: ItemsControl > ListBox > ListView), but this is just when you want to further optimize. In general you should choose your controls by their features, so if you don't need selection and just a list, the ItemsControl is the appropriate control. If you want to also manage selection then go for a ListBox. If you also need to provide resizeable and draggable columns, then choose a ListView.does that mean that the less template used by a specific element, the more efficient they will be?
Sorry for this, I just wanted to indicate that the Border could contain any content. The ... was an indication of that, not the actual xaml :)I really didn't know where and how to use the code...
Re: ListView / ListBox: Insert single special data into them
Hi sfernandez,
Thanks for the explanation and it all makes sense now! I am closing off this topic as I think the xaml code will eventually work, but I can't make it work for any reason :( I think that because I never learn xaml before!
My personal wish will be, if there is any sample xaml I can look at then I might be able to figure out. But I can live without it as well cause the file is working with the one I attached here. Thanks a lot!
Thanks for the explanation and it all makes sense now! I am closing off this topic as I think the xaml code will eventually work, but I can't make it work for any reason :( I think that because I never learn xaml before!
My personal wish will be, if there is any sample xaml I can look at then I might be able to figure out. But I can live without it as well cause the file is working with the one I attached here. Thanks a lot!
-
-
sfernandez
Site Admin
- Posts: 3363
- Joined:
Re: ListView / ListBox: Insert single special data into them
Could you please indicate what xaml code is not working for you, I can help you get what you need.
Who is online
Users browsing this forum: No registered users and 3 guests