Announcement

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

  • Tahoe skin: boolean ListGridFields and filtering and editing

    Hi Isomorphic,

    please see this sample (now on SNAPSHOT_v11.1d_2017-03-19):
    Click image for larger version

Name:	BooleanItemListGridField.png
Views:	1
Size:	17.1 KB
ID:	243608
    There are some problems here IMHO:
    • Positioning is not in line
    • Filter BooleanItem is not vertically centered in the filter row
    • I don't understand the One-way-sign when hovering the BooleanItems in the data. Should't be the different background enough to indicate that you can't edit here?
    • The tri-state BooleanItem in the filterRow has the problem that it is not possible to identify "false" and "null" by just looking at the item. This is better in Enterprise / Simplicity. Now the user only wonders why it takes him two clicks from unselected to selected.
    While the first two are just bugs, I assume that the others are on purpose. Here I really like the other options I described better.

    Best regards
    Blama

  • Blama
    replied
    Hi Isomorphic,

    this is all fixed for me in the 12.0d sample using SNAPSHOT_v12.0d_2018-01-10.

    Best regards
    Blama

    Leave a comment:


  • Isomorphic
    replied
    The first issue you mention has been fixed for tomorrow's builds.

    The second point is indeed by design.

    Leave a comment:


  • Blama
    replied
    Hi Isomorphic,

    I can see that the 1px offset problem from #8 is fixed in SNAPSHOT_v12.0d_2018-01-07 and v11.1p_2018-01-07, thanks.

    Please note that in 12.0d, the over-styling for FormItems-issue for checkBoxItem is fixed. But I still do see two other issues here:
    • Date-column "Nationhood": Same issue on hover as before for checkBoxItem
    • checkBox-column "G8": No blue border around the filter-cell on hover (like for all other columns), only hover-image for the checkbox itself (might be on purpose, though)
    Best regards
    Blama

    Leave a comment:


  • Isomorphic
    replied
    This is fixed in 12.0 for builds dated January 6 and later - we added over-styling for FormItems in 12.0 and missed adding a couple of *Over classes for checkBoxItem.

    Note that the 1px offset problem with the two "partial" (anything) images from #8 is also fixed for tomorrow's builds, in 11.1+.
    Last edited by Isomorphic; 5th Jan 2018, 01:09.

    Leave a comment:


  • Blama
    replied
    Hi Isomorphic,

    I can see you did some changes here in 12.0d (SNAPSHOT_v12.0d_2017-12-29), but now the white cell background seems to move here on hover (Chromium 63.0.3239.84).
    The moving box issue from #8 is still present in 12.0d nevertheless.
    Click image for larger version

Name:	Filter BooleanItem hover.gif
Views:	1
Size:	114.0 KB
ID:	250964

    Best regards
    Blama

    Leave a comment:


  • Blama
    replied
    Hi Isomorphic,

    searching the forums I saw that I did not retest this one.
    I can see that it is fixed for hover, but there is still some movement for clicks (very minor for me and I assume everyone, v11.1p_2017-11-20):

    Click image for larger version

Name:	Box moves on click.gif
Views:	1
Size:	23.1 KB
ID:	250483

    As you can see on the beginning and on the end of the capture, the box moves visibly for the transition from unset to true.

    Best regards
    Blama

    Leave a comment:


  • Isomorphic
    replied
    Both of these have been fixed for builds dated August 25 and later.

    Leave a comment:


  • Blama
    replied
    Hi Isomorphic,

    the horizontal alignment issue from #1 is still open using v11.1p_2017-08-20. Please see this sample and add showFilterEditor: true.
    Also, the unset-icon moves on hover.
    Click image for larger version

Name:	CheckBox_moves.gif
Views:	1
Size:	36.8 KB
ID:	248630

    Best regards
    Blama

    Leave a comment:


  • Isomorphic
    replied
    You should already be able to use real SVGs (with <object> tags being generated rather than <img>) in 6.1 - which version are you testing?

    Leave a comment:


  • Blama
    replied
    Hi Isomorphic,

    I improved handling of the file a bit. For now, I'll just replace your CheckBox files and not use a sprite.
    Attached the revised SVG file and the code I use to convert it to a pngs, if needed (Windows bat file).

    Code:
    echo off
    set customerName=%1
    set customerColor=%2
    
    REM Replacement Icons
    mkdir workdir\%customerName%\replacements
    
    for /R replacements %%a in (cb-sprites.svg) do (
        @copy replacements\%%~na%%~xa workdir\%customerName%\replacements\%%~na%%~xa
        REM skinned version
        rxrepl.exe --file workdir\%customerName%\replacements\%%~na%%~xa --alter --no-backup --search #157FCC --replace %customerColor%
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-TrueDisabled.png" "--export-id=checkboxTrueDisabled_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-True.png" "--export-id=checkboxTrue_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-TrueOver.png" "--export-id=checkboxTrueOver_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-TrueDown.png" "--export-id=checkboxTrueDown_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-FalseDisabled.png" "--export-id=checkboxFalseDisabled_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-False.png" "--export-id=checkboxFalse_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-FalseOver.png" "--export-id=checkboxFalseOver_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-FalseDown.png" "--export-id=checkboxFalseDown_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-UnsetDisabled.png" "--export-id=checkboxUnsetDisabled_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-Unset.png" "--export-id=checkboxUnset_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-UnsetOver.png" "--export-id=checkboxUnsetOver_outerbox" "--export-width=24" "--export-background-opacity=100"
        "C:\Program Files\Inkscape-0.48\inkscape.exe" -f "workdir\%customerName%\replacements\%%~na%%~xa" -e "workdir\%customerName%\replacements\cb-UnsetDown.png" "--export-id=checkboxUnsetDown_outerbox" "--export-width=24" "--export-background-opacity=100"
    
        del workdir\%customerName%\replacements\%%~na%%~xa
        echo source:[replacements\%%~na%%~xa] to:[replacements\%%~na.png] ["12 versions"]
    )
    Best regards
    Blama
    Attached Files

    Leave a comment:


  • Blama
    replied
    Hi Isomorphic,

    I wanted to try something new and I'll anyway want to customize the blue color of the Check, so I created this sprite in Inkscape. Perhaps it will help you targeting this one faster.

    Most likely using a sprite here involves more skin changes. I saw that you have a sprite file in Enterprise here, but use small pngs cut from the sprite.

    If you change the SVG, can you please include it in the framework download? Best, for all *.png and *.gif you deliver (see also here).

    skin_styles.css changes:
    Code:
    .checkboxTrueDisabled,
    .checkboxTrue,
    .checkboxTrueOver,
    .checkboxTrueDown,
    .checkboxFalseDisabled,
    .checkboxFalse,
    .checkboxFalseOver,
    .checkboxFalseDown,
    .checkboxPartialDisabled,
    .checkboxPartial,
    .checkboxPartialOver,
    .checkboxPartialDown,
    .checkboxUnsetDisabled,
    .checkboxUnset,
    .checkboxUnsetOver,
    .checkboxUnsetDown {
      min-height: 25px;
      display: inline-block;
      background-position: 0px 0px;
      padding-left: 10px;
      vertical-align: middle !important;
      background: url(./images/LT/replacements/cb-sprites.png) no-repeat;
      width: 25px;
      height: 25px;
      }
    
    .checkboxTrueDisabled {
      background-position: -3px -4px;
    }
    
    .checkboxTrue {
      background-position: -32px -4px;
    }
    
    .checkboxTrueOver {
      background-position: -61px -4px;
    }
    
    .checkboxTrueDown {
      background-position: -90px -4px;
    }
    
    .checkboxFalseDisabled {
      background-position: -3px -37px;
    }
    
    .checkboxFalse {
      background-position: -32px -37px;
    }
    
    .checkboxFalseOver {
      background-position: -61px -37px;
    }
    
    .checkboxFalseDown {
      background-position: -90px -37px;
    }
    
    .checkboxUnsetDisabled {
      background-position: -3px -70px;
    }
    
    .checkboxUnset {
      background-position: -32px -70px;
    }
    
    .checkboxUnsetOver {
      background-position: -61px -70px;
    }
    
    .checkboxUnsetDown {
      background-position: -90px -70px;
    }
    cb-sprites.png:
    Click image for larger version

Name:	cb-sprites.png
Views:	1
Size:	3.5 KB
ID:	243668

    cb-sprites.svg:

    Rename cb-sprites.txt

    Best regards
    Blama
    Attached Files

    Leave a comment:


  • Isomorphic
    replied
    The "one way sign" you refer to is the standard cursor for indicating something is non-interactive, which is what it is doing here.

    The others are already tracked.

    Leave a comment:

Working...
X