Announcement

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

    percentage value doesn't work when used with snapOffsetLeft/Top for a R/B snapTo

    SmartClient Version: v12.1p_2021-05-19/AllModules Development Only (built 2021-05-19)

    Chrome on MacOS

    Hello, please try the snapTo showcase sample, modified like this:


    Code:
    // --------------------------------
    // Simple snap to
    var commonProps = {
    height: 80, width: 80,
    align: "center",
    border: "1px solid black",
    styleName: "exampleTextBlock"
    };
    
    // --------------------------------
    // Snap to with fixed pixel offsets
    
    isc.Canvas.create({
    ID: "offsetContainer",
    height: 300, width: 400,
    minHeight: 280, minWidth: 280,
    border: "1px solid #7e7e7e",
    overflow: "hidden",
    showHover: true,
    prompt: "Snap offsets specified",
    canDragResize: true,
    peers: [
    isc.Label.create({
    ID: "label1a",
    contents: "Top Left",
    backgroundColor: "#FFAAAA",
    snapTo: "TL",
    snapOffsetTop: 10,
    snapOffsetLeft: 10
    }, commonProps),
    
    isc.Label.create({
    ID: "label2a",
    contents: "Top Right",
    backgroundColor: "#BEC9FE",
    snapTo: "TR",
    snapOffsetTop: 10,
    snapOffsetLeft: -10
    }, commonProps),
    
    isc.Label.create({
    ID: "label3a",
    contents: "Bottom Left",
    backgroundColor: "#D8D5D6",
    snapTo: "BL",
    snapOffsetLeft: 10,
    snapOffsetTop: "-10%"
    }, commonProps),
    
    isc.Label.create({
    ID: "label4a",
    contents: "Left",
    backgroundColor: "#CCFFCC",
    snapTo: "L",
    snapOffsetLeft: 10
    }, commonProps),
    
    isc.Label.create({
    ID: "label5a",
    contents: "Right",
    backgroundColor: "#AB5654",
    snapTo: "R",
    snapOffsetLeft: -10
    }, commonProps),
    
    isc.Label.create({
    ID: "label6a",
    contents: "Bottom",
    backgroundColor: "#DCEFEF",
    snapTo: "B",
    snapOffsetTop: -10
    }, commonProps),
    
    isc.Label.create({
    ID: "label7a",
    contents: "Top",
    showHover: true,
    prompt: "SnapOffsetTop using percentage",
    backgroundColor: "#FFCC99",
    snapTo: "T",
    snapOffsetTop: 10
    }, commonProps),
    
    isc.Label.create({
    ID: "label8a",
    contents: "Bottom Right",
    backgroundColor: "#F8BFFB",
    snapTo: "BR",
    snapOffsetTop: -10,
    snapOffsetLeft: "-10%"
    }, commonProps)
    ]
    });
    
    isc.HLayout.create({
    ID: "controlLayout",
    membersMargin: 20,
    height: 800, width: 1000,
    members: [
    offsetContainer
    ]
    });
    as you may see, I'm trying to use a percent value for the snapOffsetLeft (label8a) and snapOffsetTop (label3a), but those labels doesn't show with this settings, I don't know if I'm missing something or if it doesn't work.

    #2
    Hello Isomorphic could you please comment on this post? Is it valid to use a percentage as snapOffsetTop/Left ?

    Comment


      #3
      Hi!
      Sorry this got missed. No - we don't currently support snapOffsetTop/Left being a percentage.
      We do support setting left and top as a simple percentage for children of some parent.
      Alternatively you could do your own percent-snap-offset behavior by initially calculating the desired offset as a pixel value, and then observing "resized" on the snap-target and recalculating the value if the size of the target changes

      Regards
      Isomorphic Software

      Comment


        #4
        Thank you very much for your detailed explanation.

        Comment

        Working...
        X