Jamieh
Topic Author
Posts: 70
Joined: 12 Apr 2019, 00:30

Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

23 Jun 2020, 02:47

I am porting our Unity Noesis app from 2.2 to 3.0. Most of it is working, but I am having trouble with a custom ListView/GridView in the project.

I have distilled the offending code down to this for troubleshooting simplicity:
<ListView Grid.Column="0" BorderThickness="0" x:Name="PlayerListData" Margin="0" ItemsSource="{Binding BindablePlayers}" FontSize="16" ScrollViewer.PanningMode="Both" SelectedItem="{Binding SelectedPlayer, Mode=TwoWay}">
  <ListView.ItemContainerStyle>
    <Style TargetType="{x:Type ListViewItem}"  >
      <Setter Property="Foreground" Value="Green" />
    </Style>
  </ListView.ItemContainerStyle>
  <ListView.View>
    <GridView AllowsColumnReorder="False">
      <GridView.ColumnHeaderContainerStyle>
        <Style TargetType="{x:Type GridViewColumnHeader}">
          <Setter Property="HorizontalContentAlignment" Value="Stretch" />
          <Setter Property="VerticalContentAlignment" Value="Stretch" />
          <Setter Property="Margin" Value="0" />
          <Setter Property="Padding" Value="0" />
        </Style>
      </GridView.ColumnHeaderContainerStyle>
      <GridViewColumn Header="{Binding HeaderLastName}" HeaderTemplate="{StaticResource DynastyGridViewHeaderTemplate}">
        <GridViewColumn.CellTemplate>
          <DataTemplate>
            <TextBlock Text="{Binding LastName}" Foreground="{Binding ForegroundColor}" Margin="3,0,3,0" />
          </DataTemplate>
        </GridViewColumn.CellTemplate>
      </GridViewColumn>
    </GridView>
  </ListView.View>
</ListView>
For some reason, in 3.0 this is showing up with a magenta background and the data binding is just showing the class name instead of properly binding the data (screenshot below). I have read that the magenta background probably means a theming issue? I was using a modified version of NoesisStyle.xaml in 2.2 and I believe I am setting that modified XAML file as the default theme for my 3.0 project. It has styles for ListView but not GridView.

Any thoughts on what I'm doing wrong? I figure it has to be style related, but I don't understand why the databinding is now broken.
BTW the green text was just to prove I could still adjust the styling.

LIstView/Gridview 3.0:
https://1drv.ms/u/s!AjEAlWO9Yl9unMFY6txRJlPdNbUm4w

2.2.6 (with more columns and styling)
https://1drv.ms/u/s!AjEAlWO9Yl9unMFXzkhI_M7Ycg-7zQ
 
User avatar
sfernandez
Site Admin
Posts: 2983
Joined: 22 Dec 2011, 19:20

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

23 Jun 2020, 12:10

In 3.0 controls showing a magenta background mean that they are using our internal debug template, instead of using the template defined for your application. This usually happens when using local styles that are not based on the styles defined in your application (by using the BasedOn property).

Our application framework provides a full theme you can use in your application directly or as reference to create your own styles/templates. If you are already using it you can modify your xaml so it uses theme styles and templates as fallback:
<ListView Grid.Column="0" BorderThickness="0" x:Name="PlayerListData" Margin="0" ItemsSource="{Binding BindablePlayers}" FontSize="16" ScrollViewer.PanningMode="Both" SelectedItem="{Binding SelectedPlayer, Mode=TwoWay}">
  <ListView.ItemContainerStyle>
    <Style TargetType="{x:Type ListViewItem}" BasedOn="{StaticResource {x:Type ListViewItem}}">
      <Setter Property="Foreground" Value="Green" />
    </Style>
  </ListView.ItemContainerStyle>
  <ListView.View>
    <GridView AllowsColumnReorder="False">
      <GridView.ColumnHeaderContainerStyle>
        <Style TargetType="{x:Type GridViewColumnHeader}" BasedOn="{StaticResource {x:Type GridViewColumnHeader}}">
          <Setter Property="HorizontalContentAlignment" Value="Stretch" />
          <Setter Property="VerticalContentAlignment" Value="Stretch" />
          <Setter Property="Margin" Value="0" />
          <Setter Property="Padding" Value="0" />
        </Style>
      </GridView.ColumnHeaderContainerStyle>
      <GridViewColumn Header="{Binding HeaderLastName}" HeaderTemplate="{StaticResource DynastyGridViewHeaderTemplate}">
         <GridViewColumn.CellTemplate>
          <DataTemplate>
            <TextBlock Text="{Binding LastName}" Foreground="{Binding ForegroundColor}" Margin="3,0,3,0" />
          </DataTemplate>
        </GridViewColumn.CellTemplate>
      </GridViewColumn>
    </GridView>
  </ListView.View>
</ListView>
 
Jamieh
Topic Author
Posts: 70
Joined: 12 Apr 2019, 00:30

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

24 Jun 2020, 09:23

Ok thanks, that got me 95% of the way there. I still am running into two issues.

1. At the very right edge of my gridview headers, there is a vertical magenta sliver. (Note in the screenshot there are two magenta slivers because i have two listviews next to each other)
I must still have something not themeing/styling right? I noticed this same overhang past the end of my headers in 2.0 but it was colored the same as the rest of the headers so I just lived with it.

2. The ListView/Grid view has a weird redraw issue on the far right end (scrolled) where it isn't drawing some cells. If I update the ItemsSource by doing a sort (header click) it redraws properly
I created a column with data of 12345 for every entry to show the problem.

Before sort:
https://1drv.ms/u/s!AjEAlWO9Yl9unMFw3LbLXXUoofsKOg

After sort:
https://1drv.ms/u/s!AjEAlWO9Yl9unMFx6JUwNaSOPaVuvw

These issues are showing in the Unity editor.

I'm using the exact same xaml/styling I did in 2.0 (I believe) so I'm not sure what the issue is. Any help would be appreciated.

Thanks!
 
User avatar
sfernandez
Site Admin
Posts: 2983
Joined: 22 Dec 2011, 19:20

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

24 Jun 2020, 13:31

Regarding the magenta line at the end of the ListView headers, have you defined a custom style for the ScrollViewer? Headers are placed inside a ScrollViewer, so it could come from that control.

I'm not able to reproduce the redraw issues. Is there anything in particular with those lines or is a random issue that happens each time to a different row?
Would it be possible to get your project so we can debug what is happening, you can create a private ticket in our bugtracker.
 
Jamieh
Topic Author
Posts: 70
Joined: 12 Apr 2019, 00:30

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

25 Jun 2020, 08:09

Reasonably sure it isn't the scrollview, but not certain.

I can't just send you a project--the UI is data driven from the server and you wouldn't be able to hit the server.

I may have to create a separate project that shows the error and send that to you. I'm getting nowhere with anything I try. The redraw issue is bizarre. If I make the ListView.ItemContainerStyle Height = 50, it goes away. But why would a length issue go away with bigger height? It's almost like it is calculating the row length wrong, as even the row highlight is not extending over the entire row properly. And it all goes away if I sort/rebind the data.

In the end, all I really want to do is use the custom NoesisStyles.xaml file I created (off of your template) for our 2.2 project as the default style for the project and have everything look just like it did under 2.2. But I must be doing things wrong because I can't get that to happen.
 
User avatar
sfernandez
Site Admin
Posts: 2983
Joined: 22 Dec 2011, 19:20

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

25 Jun 2020, 10:34

Having access to your custom NoesisStyle.xaml along with the xaml containing the ListViews will be enough, I can feed it with test data to debug it.
The redraw issue is bizarre. If I make the ListView.ItemContainerStyle Height = 50, it goes away
Can you enable in the inspector panel of NoesisView the Debug Render Flag 'Overdraw' to see if anything is drawn in those cells but incorrectly clipped.
 
Jamieh
Topic Author
Posts: 70
Joined: 12 Apr 2019, 00:30

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

25 Jun 2020, 17:21

Sure, I will try the Overdraw flag. It's really weird--it's the same fields every time and as soon as I rebind the data it draws properly. So I'm pretty sure the XAML isn't wrong. It's almost like something on the initial draw or layout is going wrong and then it gets fixed on a rebind. I've got Viewboxes and scaling involved, so perhaps that is part of the problem.

I will try to gather something together to send to you to check out. Thanks.
 
Jamieh
Topic Author
Posts: 70
Joined: 12 Apr 2019, 00:30

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

26 Jun 2020, 10:22

Ok, so I was able to fix the drawing issue with a hack. After I set my ObservableCollection, I just set a 1ms timer to callback and set the ObservableCollection AGAIN. No idea why this works, and it's not the most awesome code, but I've done worse to get things to work. I tried creating a separate project to show this problem but I could not reproduce it.

I haven't figured out what is causing the magenta sliver in my GridHeader. I imagine I'm just doing something really dumb with my style. I have zipped up a test project, so maybe you can figure out what dumb thing I am doing/not doing.

https://1drv.ms/u/s!AjEAlWO9Yl9unMIkEb3 ... Q?e=eWdqmn

On a totally separate issue, I have noticed that in the process of upgrading both Noesis and Unity (to 2019.3.15f1) , I'm running into transparency issues--mainly that when I layer a image with transparency on top of another image, the transparent image has a ratty border on it. I still have the premultiply alpha code in my Editor folder from before, but maybe I am using the wrong import settings? I remember getting this working a long time back but I hadn't thought about it in a while and I don't remember exactly what I need to do to fix this.

Sorry to put multiple issues into one topic here-- I can make the alpha issue separate if that would be easier.

Thanks!
 
User avatar
jsantos
Site Admin
Posts: 3905
Joined: 20 Jan 2012, 17:18
Contact:

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

26 Jun 2020, 10:30

Sorry to put multiple issues into one topic here-- I can make the alpha issue separate if that would be easier.
Yes, please, open a new thread for that. Thanks!
 
User avatar
sfernandez
Site Admin
Posts: 2983
Joined: 22 Dec 2011, 19:20

Re: Porting Unity project from 2.2 to 3.0. Having difficulty with a ListView/GridView

26 Jun 2020, 14:23

Hi Jamieh,

I found why it was drawing the magenta line. Your NoesisStyle.xaml defined a Style for the GridViewColumnHeader named "NoesisGridViewColumnHeaderStyle" (line 6376). Because it has a name, implicit Style look up can't find it, and it is defaulting to our internal magenta style for that last padding header.

You can solve it by just removing the x:Key="NoesisGridViewColumnHeaderStyle" so implicity style look up can find it by its target type.

Who is online

Users browsing this forum: Bing [Bot], Google [Bot] and 54 guests