It is currently April 27th, 2024, 5:21 am

Diagonal buttons and how to not make them stack

Get help with creating, editing & fixing problems with skins
elimiller
Posts: 1
Joined: August 3rd, 2022, 9:13 am

Diagonal buttons and how to not make them stack

Post by elimiller »

Hi everyone, i'll try to make it short: my aim is to make a series of rectangular buttons from top to bottom in a diagonal way, (in my country we say "Fish Spine" to indicate this arrangement, don't know if it's the same for you) and, of course, this way makes the Top-Left and Bottom-Right of the button clear, void of any pixel. Still, those areas are clickable, and as such the buttons overstack one on top of the other, making clicking a mess. I tried to change the meter into an image, a straight image rotated with the command, but it's the same. Is there any option to tell rainmeter to no make alpha clickable? Or if there is any other solution at all. Thank you.
User avatar
CodeCode
Posts: 1366
Joined: September 7th, 2020, 2:24 pm
Location: QLD, Australia

Re: Diagonal buttons and how to not make them stack

Post by CodeCode »

Hi, well every shape formed with the dimensions of a rectangle, are even a rectangle if they are transparent. so the clicking overwrite eachother, and may even seem random as a new one is hovered with the mouse.

Going a bit further, using lines and/or arcs can limit the clickable area to the exact shape.

Look further into THIS .
ƈǟռ'ȶ ʄɨӼ ɨȶ ɨʄ ɨȶ ǟɨռ'ȶ ɮʀօӄɛ - ʊռʟɛֆֆ ɨȶ ɨֆ ɨռ ƈօɖɛ.
User avatar
SilverAzide
Rainmeter Sage
Posts: 2611
Joined: March 23rd, 2015, 5:26 pm

Re: Diagonal buttons and how to not make them stack

Post by SilverAzide »

elimiller wrote: August 3rd, 2022, 9:14 am Hi everyone, i'll try to make it short: my aim is to make a series of rectangular buttons from top to bottom in a diagonal way, (in my country we say "Fish Spine" to indicate this arrangement, don't know if it's the same for you) and, of course, this way makes the Top-Left and Bottom-Right of the button clear, void of any pixel. Still, those areas are clickable, and as such the buttons overstack one on top of the other, making clicking a mess. I tried to change the meter into an image, a straight image rotated with the command, but it's the same. Is there any option to tell rainmeter to no make alpha clickable? Or if there is any other solution at all. Thank you.
You can make a button (or "clickable area") out of any shape you want, including diagonal fish bone shapes. See the docs on Shapes.

Your alternate approach using an image rotated with TransformationMatrix will work too, but the mouse will not react properly to the rotated shape, so it requires extra work.
Gadgets Wiki GitHub More Gadgets...
User avatar
balala
Rainmeter Sage
Posts: 16174
Joined: October 11th, 2010, 6:27 pm
Location: Gheorgheni, Romania

Re: Diagonal buttons and how to not make them stack

Post by balala »

elimiller wrote: August 3rd, 2022, 9:14 am Hi everyone, i'll try to make it short: my aim is to make a series of rectangular buttons from top to bottom in a diagonal way, (in my country we say "Fish Spine" to indicate this arrangement, don't know if it's the same for you) and, of course, this way makes the Top-Left and Bottom-Right of the button clear, void of any pixel. Still, those areas are clickable, and as such the buttons overstack one on top of the other, making clicking a mess. I tried to change the meter into an image, a straight image rotated with the command, but it's the same. Is there any option to tell rainmeter to no make alpha clickable? Or if there is any other solution at all. Thank you.
Beside by CodeCode's and SilverAzide's reply, I'm not sure it is possible, but first thing is to post a code of your skin, please. Usually note that Rainmeter doesn't react to transparent pixels of meters, but there are ways to make those pixels not visible, but clickable. So let's us see a code, please.