Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    12.1d: ListGrid with rotated titles column header design

    Hi Isomorphic,

    I saw your blog post and your new 12.1d feature, which is very nice for Boolean-ListGrids, like the one in the sample.
    As design suggestion, would this perhaps look better, when hovering a column header.

    Click image for larger version  Name:	ListGrid rotated titles.png Views:	1 Size:	34.1 KB ID:	255841

    Best regards
    Blama

    #2
    Hi Isomorphic,

    I can see there are changes here to match that design, which is nice IMHO. I still do see these issues, though:
    • If sorted by a rotated column, the column title moves
    • If moving out of the ListGrid via the top of a sorted column, the column picker moves and stays. This does not happen for other columns.
      The video shows both issues:
      Click image for larger version

Name:	Hover.gif
Views:	64
Size:	93.1 KB
ID:	255926
    Best regards
    Blama

    Comment


      #3
      Hi Isomorphic,

      sorry, please disregard point 2 in #2. This is the sort indicator is confused with the column picker.

      Best regards
      Blama

      Comment


        #4
        Your remaining complaint - that the title moves - is not something we consider a negative trait in a rollover effect, so we do not plan further changes.

        Comment


          #5
          Hi Isomorphic,

          just to clarify, this is not on hover, but on click and happening for the columns becoming sorted and the one no longer being sorted.

          Click image for larger version

Name:	Moving header.gif
Views:	47
Size:	117.8 KB
ID:	255943

          Best regards
          Blama

          Comment


            #6
            What you observe is intended behavior and consistent with existing non-rotated behavior for horizontally centered header titles.

            Take a look at the Feature Explorer Sort sample, after adding "align:center" to the population field:

            Code:
            isc.ListGrid.create({
                ID: "countryList",
                width:500, height:224, alternateRecordStyles:true,
                data: countryData,
                fields:[
                    {name:"countryCode", title:"Flag", width:50, type:"image", imageURLPrefix:"flags/16/", imageURLSuffix:".png"},
                    {name:"countryName", title:"Country"},
                    {name:"population", align:"center",title:"Population", format:",0"},
                    {name:"area", title:"Area (km²)", format:",0"}
                ],
                // initial sort on Population, high-to-low
                sortField: 2,
                sortDirection: "descending"
            })
            If you click on on the header button for "Country," you'll see the title "Population" move to the right when the sorter is hidden on that column.

            However, even if it weren't consistent with existing non-rotated behavior, thus avoiding a separate logic path, it still is justified by virtue of allowing longer titles to be shown without clipping and avoids changes to the clip length upon sorting. Were we to center the sorter, it would mean that sorting a column would clip off a chunk of title (potentially) that was previously visible.
            Last edited by Isomorphic; 23 Nov 2018, 11:55.

            Comment


              #7
              Hi Isomorphic,

              ah, now I understand what is happening. Yes, this would need a new code path for rotated titles and I agree that this is not that important.
              Also, adding showSortArrow: false would solve the issue here, so one can decide between moving titles with a sort arrow and no moving titles without a sort arrow.

              Definitely very minor now.

              Best regards
              Blama

              Comment

              Working...
              X