Go Back   Cockos Incorporated Forums > REAPER Forums > REAPER Color Themes and Icon Sets

Reply
 
Thread Tools Display Modes
Old 10-15-2017, 05:56 PM   #1
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default Pink lines are showing after exporting from Inkscape

Hello! I have very little experience in theming I'm reading Walter guide and trying little modifications.

I imported volumethumb.png in Inkscape, draw a quick red button over it to test, export and put it back in the Theme folder. In this case Solaris LCS Blue V2. Thank you Lucas for this nice theme !

I created a new TCP called TCPBus I simply want the volume knob red to differentiate busses but here how it is:




So what makes the pink lines on the original png disappear while the ones from my exported Inkscape png show up ?
Pinknoise is offline   Reply With Quote
Old 10-15-2017, 06:36 PM   #2
strachupl
Human being with feelings
 
strachupl's Avatar
 
Join Date: Jan 2013
Posts: 648
Default

I dont know Inkscape but in gimp I can find that your pink lines are not right in RGB, they must be 255 0 255

strachupl is offline   Reply With Quote
Old 10-15-2017, 10:51 PM   #3
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Thank you ! Color code is ok but opacity has to be at max. It must have changed on import I guess.

No something does'nt work properly. The color is ok in Inkscape it must change on export some kind of filter or else.



Edit: Installed Gimp it works much better.

Last edited by Pinknoise; 10-15-2017 at 11:41 PM.
Pinknoise is offline   Reply With Quote
Old 10-15-2017, 11:28 PM   #4
strachupl
Human being with feelings
 
strachupl's Avatar
 
Join Date: Jan 2013
Posts: 648
Default

in gimp there are layers maybe in Inkscape layer or smth like this is not 100% opacity
strachupl is offline   Reply With Quote
Old 10-16-2017, 04:05 AM   #5
sickamorz
Banned
 
Join Date: Feb 2015
Location: Philippines
Posts: 741
Default

The pink lines can be affected by resizing the image, that has happened to me with Photoshop CS6.
sickamorz is offline   Reply With Quote
Old 10-16-2017, 04:20 AM   #6
albertxxxx
Human being with feelings
 
albertxxxx's Avatar
 
Join Date: Aug 2010
Location: Canary Islands (Tenerife)
Posts: 1,616
Default

Quote:
Originally Posted by strachupl View Post
I dont know Inkscape but in gimp I can find that your pink lines are not right in RGB, they must be 255 0 255

Measurements must be 1 pixel high in horizonal and 1 pixel in width when the line is vertical
__________________
THANKS FOR DONATIONS :) ...I do not care if it's a small amount, it's the thought that counts..
(Paypal --- albert290276@gmail.com)
albertxxxx is offline   Reply With Quote
Old 10-16-2017, 06:47 AM   #7
lucas_LCS
Human being with feelings
 
Join Date: Dec 2015
Posts: 2,100
Default

Quote:
Originally Posted by Pinknoise View Post
In this case Solaris LCS Blue V2. Thank you Lucas for this nice theme !
Thanks also to Albert for letting me play with his toys!

Quote:
Originally Posted by Pinknoise View Post
Thank you ! Color code is ok but opacity has to be at max. It must have changed on import I guess.

No something does'nt work properly. The color is ok in Inkscape it must change on export some kind of filter or else.

Edit: Installed Gimp it works much better.
It looks like you changed the image size to work on it and forgot to crop the image back down so the Pink Lines are helping define the outside edge of the image.



.

Last edited by lucas_LCS; 03-17-2020 at 08:18 PM. Reason: typo and removed attached image and the reference to it.
lucas_LCS is online now   Reply With Quote
Old 10-16-2017, 07:39 AM   #8
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Thanks for that image Lucas and yes thanks to Albert. I finally managed to do it with gimp.


On import images are not the same at all in Inkscape or Gimp. There must be some setting to show the png image as intended.
I have very little experience with graphic software I just fool around once in a while it's such a vast universe I should get a book or watch some videos any suggestions?

In Inkscape:


In Gimp:

Last edited by Pinknoise; 10-16-2017 at 08:01 AM.
Pinknoise is offline   Reply With Quote
Old 10-16-2017, 08:39 AM   #9
Blankfiles
Human being with feelings
 
Blankfiles's Avatar
 
Join Date: Jan 2015
Location: Canada
Posts: 1,474
Default

Ton theme Semble tres interessant
Blankfiles is offline   Reply With Quote
Old 10-16-2017, 09:55 AM   #10
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Merci c'est plutot basic pas vraiment mon theme mais une toute petite modif. C'est pas mal le plus loin que je vais me rendre pour l'instant. Malgré le fait que je trip sur la config et les themes c'est beaucoup d'investissement de temps pour un néophyte. Mes besoins sont simples en terme de layouts. Bus, Separateurs et default. Malgré la quantité de themes et de layouts disponibles je trouve pas tout le temps ceux-ci dans les themes. Au fait tout le monde fait une panoplie de MCP mais peu de TCP sur lequel je travaille beaucoup. Je trouverais utile que les super MCP ait leur contrepartie dans le TCP, question de mieux identifier les tracks.
Pinknoise is offline   Reply With Quote
Old 10-16-2017, 09:58 AM   #11
Blankfiles
Human being with feelings
 
Blankfiles's Avatar
 
Join Date: Jan 2015
Location: Canada
Posts: 1,474
Default

non tu as bien raison mais cella est quand meme du jolie boulot
Blankfiles is offline   Reply With Quote
Old 10-16-2017, 11:59 AM   #12
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

How do I change the color of the writings on the MCP: Mute, solo, arm and the contours around it ?

Can't find it either in theme tweaker or theme images.

Pinknoise is offline   Reply With Quote
Old 10-16-2017, 02:16 PM   #13
sickamorz
Banned
 
Join Date: Feb 2015
Location: Philippines
Posts: 741
Default

Quote:
Originally Posted by Pinknoise View Post
How do I change the color of the writings on the MCP: Mute, solo, arm and the contours around it ?

Can't find it either in theme tweaker or theme images.

they are in the overlay files look for files with "ol" in the name.

Last edited by sickamorz; 10-16-2017 at 02:28 PM.
sickamorz is offline   Reply With Quote
Old 10-16-2017, 02:27 PM   #14
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Can you indicate the path please ? Can't find nothing with 'ok' in the name.
I did remove bg overlay from the file though for my half buttons to show correctly.

Last edited by Pinknoise; 10-16-2017 at 03:51 PM.
Pinknoise is offline   Reply With Quote
Old 10-16-2017, 04:46 PM   #15
lucas_LCS
Human being with feelings
 
Join Date: Dec 2015
Posts: 2,100
Default

Quote:
Originally Posted by Pinknoise View Post
Can you indicate the path please ? Can't find nothing with 'ok' in the name.
I did remove bg overlay from the file though for my half buttons to show correctly.
This is the Fullscreen or fullsize layout.
the following are the files you need to alter:

in the main image folder:
---------------------------
mcp_solo_on_ol.png
mcp_solo_off_ol.png
mcp_solodefeat_on_ol.png

mcp_mute_on_ol.png
mcp_mute_off_ol.png

mcp_phase_inv_ol.png
mcp_phase_norm_ol.png

mcp_fx_dis_ol.png
mcp_fx_empty_ol.png
mcp_fx_norm_ol.png

in subfolder Fullsize
----------------------
mcp_recarm_auto_on_ol.png
mcp_recarm_auto_ol.png
mcp_recarm_on_ol.png
mcp_recarm_off_ol.png

mcp_recmode_in_ol.png
mcp_recmode_out_ol.png
mcp_recmode_off_ol.png

the following files have the frame around the recmode, monitor and arm buttons:

mcp_mute_off_ol.png
mcp_mute_auto_ol.png
mcp_mute_on_ol.png

mcp_volbg.png
The VOLBG file has:
- the faderline zero marker
- the graphics located between the fader and the Solo, Mute and Phase buttons along with



.

Last edited by lucas_LCS; 10-16-2017 at 05:02 PM.
lucas_LCS is online now   Reply With Quote
Old 10-16-2017, 05:20 PM   #16
sickamorz
Banned
 
Join Date: Feb 2015
Location: Philippines
Posts: 741
Default

The problem with inkscape is the import option into inkscape, the three options are(auto, smooth & blocky) to work correctly for reaper the choice is blocky.
If the three choices don't appear when you open a image file, you must have set it to one of the other import choices. I don't know where in the preferences the setting is located. I keep mine so the choice appears every time I open an image file.

Ps. I tested it with Photoshop and it came out correctly.
sickamorz is offline   Reply With Quote
Old 10-16-2017, 07:53 PM   #17
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Thank you both will try that trick in Inscape and boy that is a lot of images to modify for a single color change!
Pinknoise is offline   Reply With Quote
Old 10-16-2017, 10:12 PM   #18
lucas_LCS
Human being with feelings
 
Join Date: Dec 2015
Posts: 2,100
Default

Quote:
Originally Posted by Pinknoise View Post
Thank you both will try that trick in Inscape and boy that is a lot of images to modify for a single color change!
yes, and that's just a small part of one layout.

I should mention that files in the main folder are shared with layouts other than the default.
This means changes you make to these files can or will affect layouts other than the default.

.
lucas_LCS is online now   Reply With Quote
Old 10-17-2017, 05:03 AM   #19
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Took me a ridiculous amount of time to change just the mute writing color.
Now that I found the right spot by moving pixel by pixel, export, try again just to align to the right position, I just want to change the writing in gimp, change mute for solo.

Once I validate the text wrote down, it wont allow me to select the text and type a new word. It's like it became an image on it's own. What is the trick to type in new text in the exact same spot ?

And do you guys have a trick to perfectly align the three parts ? The align tool works for some purposes but I would like to align the text with the lines under. Even I activate the grid it does'nt line up tidly with images.



Is it possible to align one element to the other vertically ? Right now it's all done by hand I guess there is a better way to do this. Although the option is in the align tool, selection is often acting weird on me. Sometimes I can delete things sometimes I can't for exemple.

Pinknoise is offline   Reply With Quote
Old 10-17-2017, 06:55 AM   #20
strachupl
Human being with feelings
 
strachupl's Avatar
 
Join Date: Jan 2013
Posts: 648
Default


You want this?
strachupl is offline   Reply With Quote
Old 10-17-2017, 07:22 AM   #21
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Not sure what I want and not at this point I'm very new to this. The lines that you see under are the shadows under the buttons so yes I guess I want to keep them. The pink lines are for defining unnscaled area according to the SDK doc. It already was in the copied image I'm moding.I figured it needed to stay there.

It already works I'm looking for ways to do this easier:
Pinknoise is offline   Reply With Quote
Old 10-17-2017, 07:52 AM   #22
strachupl
Human being with feelings
 
strachupl's Avatar
 
Join Date: Jan 2013
Posts: 648
Default

No, pink lines in _ol (overlay image) defy area outside element.




Quote:
Originally Posted by cockos
If use_overlays is set to 1, overlay images will also be loaded if found for buttons. Overlay images are useful for drawing shadows or highlights of buttons, typically outside of the button (and inside if you want it to interact nicely with other shadows as well). These images are named image_name_ol.png (i.e. track_mute_off_ol.png). These images will typically be mostly transparent, and are similar in format to the normal button image, except they should have pink lines in the upper left and lower right corners to delimit the area that would be outside of the button region. Overlays can also include yellow with their pink, in which case the yellow defines the outer area, and the pink defines the stretch region.
strachupl is offline   Reply With Quote
Old 10-17-2017, 09:07 AM   #23
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Thank you for your explanations. I changed the grid size really helpfull !
Pinknoise is offline   Reply With Quote
Old 10-17-2017, 05:09 PM   #24
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Well I'm stucked again. I did the exact same thing to my mcp_solo_off_ol.png and for some reason it align right behind of the solo button instead of over it.
The pink is perfect pink but something must have gone wrong on export cause the pink shows up in MCP but when I sample it it shows perfect pink in Gimp.
I don't know what went wrong you can see the solo writings hiding behind the button:


Last edited by Pinknoise; 10-17-2017 at 05:21 PM.
Pinknoise is offline   Reply With Quote
Old 10-17-2017, 05:23 PM   #25
sickamorz
Banned
 
Join Date: Feb 2015
Location: Philippines
Posts: 741
Default

Quote:
Originally Posted by Pinknoise View Post
Well I'm stucked again. I did the exact same thing to my mcp_solo_off_ol.png and for some reason it align right behind of the solo button instead of over it.
The pink is perfect pink but something must have gone wrong on export cause the pink shows up in MCP but when I sample it it shows perfect pink in Gimp.
I don't know what went wrong you can see the solo writings hiding behind the button:




I notice you always use the term export, try using save as and make sure the file type is png
sickamorz is offline   Reply With Quote
Old 10-17-2017, 05:23 PM   #26
lucas_LCS
Human being with feelings
 
Join Date: Dec 2015
Posts: 2,100
Default

Quote:
Originally Posted by Pinknoise View Post
Took me a ridiculous amount of time to change just the mute writing color.
Now that I found the right spot by moving pixel by pixel, export, try again just to align to the right position, I just want to change the writing in gimp, change mute for solo.
you're doing it the hard way.
Things for you take notice of:
- this is not 'Text' it's a drawing of text.
That means it's a drawing and not actual text.

- there are overlays for each button state.
Often these overlays are exactly the same.
Change one and then just use 'Save As' to change the others for that button.

- unless you want to change the font style, just manipulate the 'text' as a drawing.
In Gimp for, use the rectangle selection tool to select only the 'text' for all three button states.
Click on 'Colors' in the menu bar and select 'Hue-Saturation'.
Turn the lightness all the way down for darker text.
click OK.
If it's not dark enough, repeat the process.

- If you are also trying to change the font style, your best practice is to create a new transparent layer.
Just right click the current layer and select New Layer.
Then make sure 'Transparency' is selected the pop up window before clicking OK.
The new layers allow you to move resize and align before altering the actual file.
this allows you to use the original text as a guide to line up the new text.
you can the either 'Flatten' all the layers to save the file as a PNG or right click on the top layer in the layer window and select New Layer from Visible.
Delete all other layers before saving the new layer.
the last method shold avoid issues caused by Exporting.

- If the pink lines get altered accidentally, it will make the image look bad.
If they are now showing up in the image they have been moved out of their position against the edges or they are no longer pure pink.

see attachments for details.

.

Last edited by lucas_LCS; 09-09-2020 at 06:41 PM.
lucas_LCS is online now   Reply With Quote
Old 10-17-2017, 06:04 PM   #27
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Quote:
Originally Posted by sickamorz View Post
I notice you always use the term export, try using save as and make sure the file type is png
Save as in Gimp saves the file as a .xcf to use in Gimp.
Export is for exporting as .png file. So I reuse the saved .xcf file to make the next image.
Pinknoise is offline   Reply With Quote
Old 10-17-2017, 06:44 PM   #28
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Quote:
Originally Posted by lucas_LCS View Post
you're doing it the hard way.
Things for you take notice of:
- this is not 'Text' it's a drawing of text.
That means it's a drawing and not actual text.

- there are overlays for each button state.
Often these overlays are exactly the same.
Change one and then just use 'Save As' to change the others for that button.

- unless you want to change the font style, just manipulate the 'text' as a drawing.
In Gimp for, use the rectangle selection tool to select only the 'text' for all three button states.
Click on 'Colors' in the menu bar and select 'Hue-Saturation'.
Turn the lightness all the way down for darker text.
click OK.
If it's not dark enough, repeat the process.

- If you are also trying to change the font style, your best practice is to create a new transparent layer.
Just right click the current layer and select New Layer.
Then make sure 'Transparency' is selected the pop up window before clicking OK.
The new layers allow you to move resize and align before altering the actual file.
this allows you to use the original text as a guide to line up the new text.
you can the either 'Flatten' all the layers to save the file as a PNG or right click on the top layer in the layer window and select New Layer from Visible.
Delete all other layers before saving the new layer.
the last method shold avoid issues caused by Exporting.

- If the pink lines get altered accidentally, it will make the image look bad.
If they are now showing up in the image they have been moved out of their position against the edges or they are no longer pure pink.

see attachments for details.

.
The pink must be changed some how but also I had to crop the canvas to the image that helped. Also I lost the background transparency I think that happened when I merged the layers so now I export with the white instead of tranparency.
Pinknoise is offline   Reply With Quote
Old 10-18-2017, 01:28 PM   #29
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

So I managed to finally change some of the writings:



Another thing I'm having trouble with is I want to change the mcp_bgsel.png it's fine if I just change to color or make line around the MCP but if I put some images like I did here just for testing they are being stretched. I'd like to try to do something like in Imperial when track is selected there is an image change. But right now it's not working at all. How to prevent stretch ?

I tried to recopy the Imperial image with pink lines on both sides but it's not working.

Pinknoise is offline   Reply With Quote
Old 10-18-2017, 03:39 PM   #30
sickamorz
Banned
 
Join Date: Feb 2015
Location: Philippines
Posts: 741
Default

Quote:
Originally Posted by Pinknoise View Post
So I managed to finally change some of the writings:



Another thing I'm having trouble with is I want to change the mcp_bgsel.png it's fine if I just change to color or make line around the MCP but if I put some images like I did here just for testing they are being stretched. I'd like to try to do something like in Imperial when track is selected there is an image change. But right now it's not working at all. How to prevent stretch ?

I tried to recopy the Imperial image with pink lines on both sides but it's not working.

Doing what you want is mentioned in "Walter manual" or in the document "power of pink", check the stickies at top of this forum page.
sickamorz is offline   Reply With Quote
Old 10-18-2017, 04:31 PM   #31
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

ok I'll check it out thanks
Pinknoise is offline   Reply With Quote
Old 10-18-2017, 09:29 PM   #32
lucas_LCS
Human being with feelings
 
Join Date: Dec 2015
Posts: 2,100
Default

Quote:
Originally Posted by Pinknoise View Post
Another thing I'm having trouble with is I want to change the mcp_bgsel.png it's fine if I just change to color or make line around the MCP but if I put some images like I did here just for testing they are being stretched. I'd like to try to do something like in Imperial when track is selected there is an image change. But right now it's not working at all. How to prevent stretch ?

I tried to recopy the Imperial image with pink lines on both sides but it's not working.
Imperial works differently
Things to note:
1) The Imperial v5 MCP_BG is only desiged for full screen size and only allows stretching the FX list section without distorting other areas.
Look at the Pink lines in that file.

2) The Imperial v5 fader line is embedded in the MCP_BG.PNG and MCP_BGSEL.PNG.
This allows the fader line graphic to be different on the MCP_BGSEL file.
The Solaris Blue fader line is embedded in the MCP_VOLBG.PNG.
I was unable to find a way to switch the image using that file.

3) The Imperial v5 theme fader section remains the same size as gets pushed down off the page, but the graphics for that section are still visible.
In Solaris Blue I chose to put the fader line in the MCP_VOLBG so it could be removed when the layout got too small and a knob was required.
This function has higher priority to me than making it light up when selected.
Use whchever method you prefer, but understand the tradeoffs involved.


.
lucas_LCS is online now   Reply With Quote
Old 10-19-2017, 04:15 PM   #33
lucas_LCS
Human being with feelings
 
Join Date: Dec 2015
Posts: 2,100
Default

Quote:
Originally Posted by Pinknoise
.. I lost the background transparency I think that happened when I merged the layers ..
My apologies, do not Flattened or merge the layers.
This causes it to lose the transparency.
Instead, just right click on the top layer in the layer window and select New Layer from Visible.
Delete all other layers before saving the new layer.
Make sure to select .PNG is the file type and make sure the name ends with .PNG.

your other option to is the select all of the completed image, the click 'FILE' in the main menu, select 'Create' and then select 'From Clipboard'.
this will give you the image as a new file to save with the desired image name.

.
lucas_LCS is online now   Reply With Quote
Old 10-20-2017, 08:38 PM   #34
sickamorz
Banned
 
Join Date: Feb 2015
Location: Philippines
Posts: 741
Default

Quote:
Originally Posted by lucas_LCS View Post
My apologies, do not Flattened or merge the layers.
This causes it to lose the transparency.
Instead, just right click on the top layer in the layer window and select New Layer from Visible.
Delete all other layers before saving the new layer.
Make sure to select .PNG is the file type and make sure the name ends with .PNG.

your other option to is the select all of the completed image, the click 'FILE' in the main menu, select 'Create' and then select 'From Clipboard'.
this will give you the image as a new file to save with the desired image name.

.
just some info to all readers of this subject, if you use Photoshop you won't have the problems experienced here.
I use Photoshop CS6
sickamorz is offline   Reply With Quote
Old 10-23-2017, 07:17 PM   #35
Pinknoise
Human being with feelings
 
Pinknoise's Avatar
 
Join Date: Aug 2012
Location: Around Montréal
Posts: 1,117
Default

Thank you Lucas for your explanations. I still have a lot of homework to do.

Quote:
Originally Posted by sickamorz View Post
just some info to all readers of this subject, if you use Photoshop you won't have the problems experienced here.
I use Photoshop CS6

I stumbled on another post saying exactly that. You get what you pay for I guess.
Pinknoise is offline   Reply With Quote
Old 10-23-2017, 10:34 PM   #36
sickamorz
Banned
 
Join Date: Feb 2015
Location: Philippines
Posts: 741
Default

Quote:
Originally Posted by Pinknoise View Post
Thank you Lucas for your explanations. I still have a lot of homework to do.




I stumbled on another post saying exactly that. You get what you pay for I guess.
I came across Photoshop lite portable for free. It downloaded but I was not able to run it since I have cs6, it started cs6 instead. This has the layers that are needed for any serious use.

This is not a pirate hack it is a legal version from Adobe as far as I'm able to tell.
sickamorz is offline   Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT -7. The time now is 07:45 AM.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2024, vBulletin Solutions Inc.