Image rotation?

Quote:

---

Originally Posted by pindercarl

You could, theoretically draw the cards with frames. I'm definitely not an expert on rulesets or extensions. I can look at the scripts registered to the API, but I'm not familiar with their actual usage.

---

Wow, that's a weird trick I never would have thought of - but it looks like it might work! Thanks for the suggestion :)

Yep, it worked!

Attachment 67128

Do you happen to know if frame images can be scaled (like other icons), or will I need to resize the images (or the UI space for them)?

Here's the code in case someone is interested:

Code:

---

function showCardFaceUp(cCard, nCardId, x, y, w, h) -- rotatable
  local aCard = AllCards[math.abs(nCardId)];
  if not aCard then print("[Tarot Reading] Missing Card: " .. tostring(nCardId) .. " of " .. #AllCards); return; end

  if cCard.textWidget then
      cCard.textWidget.destroy();
      cCard.textWidget = nil;
  end

  local wText = cCard.addTextWidget(nil, " "); -- text can't be empty!
  cCard.textWidget = wText;
  local textW, textH = wText.getSize();
  local sFrame = "F_" .. getIconName(aCard); -- add frame prefix
  wText.setFrame(sFrame, (w - textW) / 2, (h - textH) / 2, (w - textW) / 2, (h - textH) / 2); -- left, top, right, bottom
  if nCardId < 0 then wText.setRotation(180); end  -- inverted

  cCard.setStaticBounds(x, y, w, h);
  cCard.setVisible(true);
  cCard.setEnabled(true);
end

 <framedef name="F_TRT0_Magician"><bitmap file="graphics/tarot/01_Magician.jpg" /><offset>0,0,0,0</offset></framedef>

 <template name="card">
  <stringcontrol>
      <anchored width="300" height="500"><top offset="0" /><left offset="0" /></anchored>
      <invisible/>
      <script>
        function onClickDown(nButton, x, y)
            return true; -- necessary for onClickRelease
        end

        function onClickRelease(nButton, x, y)
            Tarot.mouseClickOnLargeCard(window, self);
            return true;
        end
      </script>
  </stringcontrol>
 </template>

---

OMG! It's working, it's workiing! :D

Carl said

Quote:

---

It may only support rotation in 90-degree increments, but I didn't dig far enough to verify.

---

If so does that mean cards can be turn sideways with -270 degrees?

Quote:

---

Originally Posted by jkeller

Yep, it worked!

Do you happen to know if frame images can be scaled (like other icons), or will I need to resize the images (or the UI space for them)?

---

So hyped! so couldnt wait a pro answer but this is what LM said [maybe it gives a hint]:

• Nine-Slice Logic: The frame bitmap is divided into nine sections. The four corners remain static (preserving their original dimensions), while the top, bottom, and side edges are stretched to match the width and height of the control. The center of the frame is either tiled or stretched to fill the background.
• The Role of Offsets: You define these stretchable regions using the <offset> tag (consisting of four comma-separated numbers for Left, Top, Right, and Bottom). These margins tell the engine which parts of the image are corners and which are the "stretchable" edges.
• Anchoring?

• <anchor > ... </anchor>

  The edge used from the parent panel: "left", "right", "right" or "bottom"

EDIT:
Or there is <GETgridoffset> under imagecontrol.
And setGridOffset

<gridoffset > ... </gridoffset>

The X and Y coordinates to offset the first grid square from the upper left corner of the map. The default value is (0,0).

getGridoffet

function getGridOffset()

Returns the offset of the first grid square in the top left corner of the image. The offsets will be different from zero as a result of the grid not being perfectly aligned with the top left corner of the image itself. The values will vary from zero to -((grid size) - 1).
Return values
(number)
The horizontal offset of the grid
(number)
The vertical offset of the grid

---

setGridoffset

function setGridOffset(offsetx, offsety)

Sets the offset of the first grid square in the top left corner of the image. The valid values for the offsets range from zero to -((grid size) - 1), any values not in this range will be converted to fit the interval.
Parameters
offsetx (number)
The horizontal grid offset
offsety (number)
The vertical grid offset

Alternatively, If things upstairs doesnt work I found this:

• Icons vs. Frames: Unlike frames, icons and bitmaps in a genericcontrol or bitmapwidget can be scaled more simply using draw modes like "fit" or "fill", which adjust the asset size to the control's dimensions without the nine-slice logic.

getDrawMode under genericcontrol

Code:

---

<genericcontrol >
  <icon > ... </icon>
  <iconcolor > ... </iconcolor>
  <drawmode> ... </drawmode>
</genericcontrol>

---

drawmode

Valid values are: ““ (default), “fill”, “fit”. ”” = The default draw mode will only adjust icon/asset size if too large for control size. Otherwise, icon/asset is drawn at original dimensions in the center of the control. ”fill” = Scale asset to fill control. ”fit” = Scale asset to fit control.

getDrawMode

function getDrawMode()
Get the draw mode assigned to this control.
Return values
(string)
The draw mode string set for this control (See Definition above.)

Quote:

---

Originally Posted by Tempered7

OMG! It's working, it's workiing! :D

Carl said
If so does that mean cards can be turn sideways with -270 degrees?

---

I've only tried 180 so far, but 90 or 270 should work, and would be all we need (even if it only does increments of 90).

I'll try that "fit" or "fill" now, sounds promising. Without those, too-large images are clipped, and too-small images are tiled.

Thanks for all the help everyone!

Good to know!
Thanks for doing this J, I appreciate your time and your extensions, and this is actually so much fun! :)
Best of luck.

EDIT: I think I saw minus degrees somewhere in the wiki. So it might be useful.

Quote:

---

Originally Posted by jkeller

I've only tried 180 so far, but 90 or 270 should work, and would be all we need (even if it only does increments of 90).

I'll try that "fit" or "fill" now, sounds promising. Without those, too-large images are clipped, and too-small images are tiled.

Thanks for all the help everyone!

---

It looks like it accepts arbitrary angles. Due to the way we render text, it doesn't look good unless the text is at right angles. For a frame, it should be okay.

Quote:

---

Originally Posted by pindercarl

It looks like it accepts arbitrary angles. Due to the way we render text, it doesn't look good unless the text is at right angles. For a frame, it should be okay.

---

Thanks for the good news.
Does it accept minus degress for the opposite directions?

Such as -270 for sideways? Or how to exactly turn a card sideways?

Quote:

---

Originally Posted by Tempered7

Thanks for the good news.
Does it accept minus degress for the opposite directions?

Such as -270 for sideways? Or how to exactly turn a card sideways?

---

It does not accept negative numbers. -270 should be the same as 90. 360 (since 0 and 360 are the same) minus 270 equals 90.

As for your previous question, do frames scale? Not in the way that you would want. The image for the frame tiles to fill the available space.