12.0p Bug with Layout and resizeBar AutoChild canDrag canCollapse properties

[Blama]

Hi Isomorphic,

please see this modified online testcase (v12.0p_2019-12-07).

I expect the VLayout not to be resizeable via the resizeBar click or drag because of the properties set (here in production, we would only disallow canDrag, but both are not working). But the sample is behaving as if I did not set any properties.

Code:

isc.HLayout.create({
    width: "100%",
    height: "100%",
    members: [
        isc.Label.create({
            ID: "test",
            contents: "Navigation",
            align: "center",
            overflow: "hidden",
            width: "30%",
            showResizeBar: true,
[B]resizeBar: {canDrag: false, canCollapse:false},[/B]
            border: "1px solid blue"
        }),
        isc.VLayout.create({
            width: "70%",
            members: [
                isc.Label.create({
                    contents: "Listing",
                    align: "center",
                    overflow: "hidden",
                    height: "30%",
                    showResizeBar: true,
                    border: "1px solid blue"
                }),
                isc.Label.create({
                    contents: "Details",
                    align: "center",
                    overflow: "hidden",
                    height: "70%",
                    border: "1px solid blue"
                })
            ]
        })
    ]
});
isc.logWarn("canDrag:" + test.resizeBar.canDrag)
isc.logWarn("canCollapse:" + test.resizeBar.canCollapse)

Best regards
Blama

[Blama]

Also using

resizeBar[B]Properties[/B]: {canDrag: false, canCollapse:false},

has the same result (but then you'd have to remove the last two lines). Not sure which one is correct at the moment.

Best regards
Blama

[Isomorphic]

Both are wrong. It looks like you are guessing that property name thinking that the resizeBar is an AutoChild of the member, but it isn't - resizeBars are created and managed at the layout level.

This is presumably related to your colleague's odd request to have a resize bar that doesn't resize, but note, he's already solved that.

[Blama]

Hi Isomorphic,

yes, that's true, background is the same. And it's working like you say with resizeBarProperties at Layout-level.
Only one little problem is left (which was the main reason I preferred this AutoChild-approach to minWidth/maxWidth in the first place).
If you set canDrag:false, there still is the resize cursor shown on hover.


For background what we want to archive: We have a design like your showcase: Navigation left, content right. For us, the Navigation also includes a logo. Here is does not make sense (like it does in the showcase) to have the Navigation to be resizeable, because here the logo (PNG, not SVG) would either get resized or cropped.
Now we sometimes have the need to display more content, so we want the Navigation to be minimizable by click.

isc.HLayout.create({
    width: "100%",
    height: "100%",
    resizeBarProperties: {canDrag:false, canCollapse:true, showGrip: true}, //, showClosedGrip: true
    members: [
        isc.Label.create({
            ID: "test",
            contents: "Navigation",
            align: "center",
            overflow: "hidden",
            width: "30%",
            showResizeBar: true,
            border: "1px solid blue"
        }),
        isc.VLayout.create({
            width: "70%",
            resizeBarProperties: {canDrag:false, canCollapse:false},
            members: [
                isc.Label.create({
                    contents: "Listing",
                    align: "center",
                    overflow: "hidden",
                    height: "30%",
                    showResizeBar: true,
                    border: "1px solid blue"
                }),
                isc.Label.create({
                    contents: "Details",
                    align: "center",
                    overflow: "hidden",
                    height: "70%",
                    border: "1px solid blue"
                })
            ]
        })
    ]
});

Best regards
Blama

[Isomorphic]

As we've covered in both threads, for the best UE, stop trying to make the resize bars not resize bars and allow the resize. Just fix the logo so it can be clipped - not difficult. Resize bars that simply do not resize will be baffling for your end users.

But if you really want to continue down this ill-advised path, you will need to set the rest of the relevant properties: canDragResize:false, and whatever cursor you want.

[Blama]

Hi Isomorphic,

the long term solution is going to be like this, but for now we are fine with click-only.
Thanks, hResizeCursor does what I want:

resizeBarProperties: {canDrag:false, canCollapse:true, showGrip: true, hResizeCursor: "hand"},

Thank you & Best regards,
Blama