It is currently April 20th, 2024, 4:00 am

Clipping, tiling or masking images to selected area, how to?

Get help with creating, editing & fixing problems with skins
User avatar
24HourPartyPeople
Posts: 13
Joined: June 12th, 2010, 5:38 pm

Clipping, tiling or masking images to selected area, how to?

Post by 24HourPartyPeople »

Is there any trick to do this? I can't think of anything myself. I have dynamically sized area (solid rectangle) to cover so it needs to be done within code.

Sorry if it's been asked before, search didn't find anything.
[url]http://fresh-grass.deviantart.com/[/url]
User avatar
Chewtoy
Moderator
Posts: 995
Joined: June 10th, 2009, 12:44 pm
Location: Sweden

Re: Clipping, tiling or masking images to selected area, how to?

Post by Chewtoy »

http://rainmeter.net/cms/Meters-Image

Are you talking about using a selected part of the image, or resizeing the image so it fits your area?
The first on can't be done in rainmeter alone, at the very moment. The second one is very much possible. Just define W and H in the image-meter.
I don't think, therefore I'm not.
User avatar
24HourPartyPeople
Posts: 13
Joined: June 12th, 2010, 5:38 pm

Re: Clipping, tiling or masking images to selected area, how to?

Post by 24HourPartyPeople »

Already read that. I mean the 1st one, I want an image to stay as it is, I just want to limit (by masking, clipping) or expand (by tiling) the area where image is visible. If the are was fixated , I'd just edit the image itself. But since my area is changing...

It is changing by same amount of pixels though - I'm talking about that uTorrent skin I'm working on and its drop-down list. So I could break my background image into 17 different parts (16 torrents + 1 thin one at the end). And show each part only if torrent is there, the same I did with name/speed/bar.
The reason I asked is because clipping the image would be much more efficient. And I don't even know if it'll look good with textured background. So to add all that code to already 1180 lines and break image into 17 parts when I'm not sure if I'll even use any of that in the final version - it would a bit risky.

But, there is another, better looking, even simpler and faster way. I could make 16 different images, every one of them would be whole background for specific number of torrents. I already have the calculations written for background size, so all I need to add is just dynamic path to these images. It is not as efficient as clipping would be though.

I just need to decide if it would actually look good to use textured drop-down background or not. I'd use something simple with low contract and saturation, but it might give the skin too much flat of a look. I'd add shadow though, but still... What do you think?
[url]http://fresh-grass.deviantart.com/[/url]
User avatar
JpsCrazy
Posts: 667
Joined: April 18th, 2010, 2:16 pm
Location: NY, USA

Re: Clipping, tiling or masking images to selected area, how to?

Post by JpsCrazy »

In most of my experiences with textured drop down bars and other micellanous things similar, the author tried to make it look good, but it comes out tacky.

In my opinion, the best kind of drop down bar has a sleek top image, with the arrow and everything, and a very simple plain background with text on it, with contrasting colors - but not too much.
User avatar
24HourPartyPeople
Posts: 13
Joined: June 12th, 2010, 5:38 pm

Re: Clipping, tiling or masking images to selected area, how to?

Post by 24HourPartyPeople »

I agree, if you don't want to make something funky that automatically won't be as useful, it's best to go with something minimalistic. But what do you mean by arrow (and everything)? I'm new to the whole Rainmeter "scene", so I haven't seen any other skins than those that come with Rainmeter.
The problem with minimalistic is that it's hard to make something unique and user-friendly at the same time.
[url]http://fresh-grass.deviantart.com/[/url]
User avatar
JpsCrazy
Posts: 667
Joined: April 18th, 2010, 2:16 pm
Location: NY, USA

Re: Clipping, tiling or masking images to selected area, how to?

Post by JpsCrazy »

Well. I think I was thinking of a different thing than a drop down list in retrospect. :P (At least I think)
I was thinking of the bar, like how your address bar works.
And well, every drop down bar has an arrow... and that's about it.
I was really into html code for awhile and I saw some horrid, ugly drop down bars, and then some actually nice ones.
That's all.
User avatar
Chewtoy
Moderator
Posts: 995
Joined: June 10th, 2009, 12:44 pm
Location: Sweden

Re: Clipping, tiling or masking images to selected area, how to?

Post by Chewtoy »

What's the image you planned on using?
The simplest way to get a background is with BackgroundMode=#number#. It's sleek and dynamic. But it plain, and can be gradient.

But back to the question. No. you can't clip/crop images with rainmeter.
I don't think, therefore I'm not.
User avatar
24HourPartyPeople
Posts: 13
Joined: June 12th, 2010, 5:38 pm

Re: Clipping, tiling or masking images to selected area, how to?

Post by 24HourPartyPeople »

I decided to just use dark transparent rectangle. I tried a lot of different things, but this makes the text most readable. Here is a quick preview:



The "point" of the skin though, is that everything displayed in drop-down list is dynamic. Design was just necessary evil, if you can even call that "designing", since it looks suspiciously similar to poiru's skins. So far I wrote the code for 16 torrents. I'm downloading only 5 in the picture above, so background, visibility of lines/speed text act accordingly.
Another feature is that non-existent torrents that you removed while skin was running, aren't displayed anymore, like with other skins. The problem is that skins keep the data (that they get from webpage through RegExp) even when that data doesn't exist anymore in reality. I found a pretty cheap trick to determine which torrents are real and which ones aren't. This means you don't have to refresh the skin anymore.

This explanation is meant for the rest, Chewtoy already knows what I'm talking about :D

Also, which color should I use for progress bar? That green doesn't look good at all. I want to use something related to uTorrent itself, so the best choice would be white. But white doesn't stand out enough and thicker line looks plain ugly to me.
[url]http://fresh-grass.deviantart.com/[/url]
User avatar
JpsCrazy
Posts: 667
Joined: April 18th, 2010, 2:16 pm
Location: NY, USA

Re: Clipping, tiling or masking images to selected area, how to?

Post by JpsCrazy »

Well the uTorrent progress bar is blue. :P
That's always an option.
User avatar
24HourPartyPeople
Posts: 13
Joined: June 12th, 2010, 5:38 pm

Re: Clipping, tiling or masking images to selected area, how to?

Post by 24HourPartyPeople »

Blue was the first one I tried, exactly because of that, and because download color is also blue (both in uTor and my skin). I can't find the right type of blue, everything looks too dark or too "bleached".
[url]http://fresh-grass.deviantart.com/[/url]