The transparency of the search field when enter a value

[Va1ga]

Hello!
Do own skin, faced with the problem. Tell me, please, is it possible to implement the transparency of the background when enter a value in the search field?
Point:
1. There is a search field with the value " Search Google";
2. When you move the mouse, it changes to "Click me";
(I implemented these two points)
3. After clicking the left mouse button should be able to typed a search query so that it turned out:
a. Paragraphs 1 and 2 should not be visible;
b. The background must remain transparent;
C. only the query you enter is displayed.
Thanks!

Code: Select all

[Rainmeter]
Author=Va1ga
AppVersion=1.1
Update=1000
MouseOverAction=!execute [!RainmeterHideMeter SearchLabel][!RainmeterShowMeter SearchLabelOver][!RainmeterRedraw]
MouseLeaveAction=!execute [!RainmeterShowMeter SearchLabel][!RainmeterHideMeter SearchLabelOver][!RainmeterRedraw]

[Metadata]
Name=Search

[Variables]
font.name=jura
font.size=20
font.se=Shadow
font.ec=0,0,0,50
color.main=255,255,255,255
color.secondary=140,140,140,255
b.size.dateW=330
b.sizeH=52
b.color=0,0,0,50
;==============================

[Background]
Meter=Image
W=#b.size.dateW#
H=#b.sizeH#
SolidColor=#b.color#

[styleFont1]
FontFace=#font.name#
FontColor=#color.main#
FontSize=#font.size#
AntiAlias=1
StringEffect=#font.se#
FontEffectColor=#font.ec#
DynamicVariables=1

[styleFont2]
FontFace=#font.name#
FontColor=#color.secondary#
FontSize=#font.size#
AntiAlias=1
StringEffect=#font.se#
FontEffectColor=#font.ec#
DynamicVariables=1

[styleLine]
SolidColor=#color.main#
W=#b.size.dateW#
H=1
X=0
Y=51
;============ Search ============

[Line]
Meter=line
MeterStyle=styleLine

[SearchLabel]
Meter=String
FontFace=#font.name#
FontSize=#font.size#
FontColor=#color.main#
X=6
Y=10
AntiAlias=1
Text=Search Google

[SearchLabelOver]
Meter=String
FontFace=#font.name#
FontSize=#font.size#
FontColor=#color.main#
X=6
Y=10
W=324
AntiAlias=1
Text=Click me
LeftMouseUpAction=!CommandMeasure "SearchInput" "ExecuteBatch 1"
Hidden=1

[SearchInput]
Measure=Plugin
Plugin=InputText
FontFace=#font.name#
FontSize=#font.size#
FontColor=0,0,0,255
SolidColor=255,255,255,100
X=6
Y=7
W=318
H=38
Command1=!Execute ["http://www.google.com/search?q=$UserInput$"] DefaultValue=""
AntiAlias=1
FocusDismiss=1
UpdateDivider=-1

[balala]

The basic idea would be to change the color of those string, making them invisible.
Here is one example of what you should have to do:

• Add a DynamicVariables=1 option to both meters ([SearchLabel] and [SearchLabelOver]) - this option will be needed immediately.
• Replace the LeftMouseUpAction option of the [SearchLabelOver] meter with the following one: LeftMouseUpAction=[!SetVariable color.main "255,255,255,1"][!UpdateMeter "SearchLabel"][!UpdateMeter "SearchLabelOver"][!CommandMeasure "SearchInput" "ExecuteBatch 1-2"][!Redraw]. The !SetVariable bang makes the meters transparent, when you click the search field.
• Add the following option to the [SearchInput] measure, beside Command1: Command2=[!SetVariable color.main "255,255,255,255"][!UpdateMeter "SearchLabel"][!UpdateMeter "SearchLabelOver"][!Redraw]. The bangs of this options restore the color of the string once the search field is completed.

[jsmorley]

Keep in mind that if you make the background of the input field in an InputText measure transparent, the text characters will be transparent as well.

https://docs.rainmeter.net/manual/plugins/inputtext/#SolidColor

This is a limitation of the Windows input "control". You will find that using transparency with InputText is almost never going to be satisfying, and you might want to consider an alternative design. The placeholder meters and mouse over effects can use transparency, but when you actually click to enter text, that should probably be a solid color background with a color that fits your design.

[balala]

Keep in mind that if you make the background of the input field in an InputText measure transparent, the text characters will be transparent as well.

What I have described above doesn't afect the input field, just the strings placed below the input field, so probably your concern doesn't apply here.

[jsmorley]

What I have described above doesn't afect the input field, just the strings placed below the input field, so probably your concern doesn't apply here.

Well, it seems to me that the entire point of worrying about the transparency of what is behind the input field is entirely and singularly due to intending the input field itself to have some transparency, and my post was to warn that this will behave in a way that might not be expected, since the text will also have the same transparency.

[balala]

Well, it seems to me that the entire point of worrying about the transparency of what is behind the input field is entirely and singularly due to intending the input field itself to have some transparency, and my post was to warn that this will behave in a way that might not be expected, since the text will also have the same transparency.

Yes, I understood your concern and you probably (as usual) would have right, but not this was my intention. I didn't affect the input field.

[jsmorley]

Yes, I understood your concern and you probably (as usual) would have right, but not this was my intention. I didn't affect the input field.

Yes, but I am going by the image he posted.

[Va1ga]

Here is one example of what you should have to do

Thanks, sorry. Unfortunately not a good idea. When using the method you described, the previously specified values (Google search and click on me) stop appearing later until the skin is reloaded.

Keep in mind that if you make the background of the input field in an InputText measure transparent, the text characters will be transparent as well.

Thank you, I know about this problem. I was looking for an opportunity to bypass this limitation, but as it turned out there is no such way. Sadly.

The result should be such a thing, given the inability to implement transparency:

[balala]

When using the method you described, the previously specified values (Google search and click on me) stop appearing later until the skin is reloaded.

No, I think you're wrong. I tried implementing what I've described and it does work for me. Here is the full modified code of your skin:

Code: Select all

[Rainmeter]
Update=1000
MouseOverAction=[!HideMeter SearchLabel][!ShowMeter SearchLabelOver][!Redraw]
MouseLeaveAction=[!ShowMeter SearchLabel][!HideMeter SearchLabelOver][!Redraw]

[Metadata]
Author=Va1ga
Name=Search

[Variables]
font.name=jura
font.size=20
font.se=Shadow
font.ec=0,0,0,50
color.main=255,255,255,255
color.secondary=140,140,140,255
b.size.dateW=330
b.sizeH=52
b.color=0,0,0,50
;==============================

[Background]
Meter=Image
W=#b.size.dateW#
H=#b.sizeH#
SolidColor=#b.color#

[styleFont1]
FontFace=#font.name#
FontColor=#color.main#
FontSize=#font.size#
AntiAlias=1
StringEffect=#font.se#
FontEffectColor=#font.ec#
DynamicVariables=1

[styleFont2]
FontFace=#font.name#
FontColor=#color.secondary#
FontSize=#font.size#
AntiAlias=1
StringEffect=#font.se#
FontEffectColor=#font.ec#
DynamicVariables=1

[styleLine]
SolidColor=#color.main#
W=#b.size.dateW#
H=1
X=0
Y=51
;============ Search ============

[Line]
Meter=line
MeterStyle=styleLine

[SearchLabel]
Meter=String
FontFace=#font.name#
FontSize=#font.size#
FontColor=#color.main#
X=6
Y=10
AntiAlias=1
Text=Search Google
DynamicVariables=1

[SearchLabelOver]
Meter=String
FontFace=#font.name#
FontSize=#font.size#
FontColor=#color.main#
X=6
Y=10
W=324
AntiAlias=1
Text=Click me
LeftMouseUpAction=[!SetVariable color.main "255,255,255,0"][!UpdateMeter "SearchLabel"][!UpdateMeter "SearchLabelOver"][!CommandMeasure "SearchInput" "ExecuteBatch 1-2"][!Redraw]
Hidden=1
DynamicVariables=1

[SearchInput]
Measure=Plugin
Plugin=InputText
FontFace=#font.name#
FontSize=#font.size#
FontColor=0,0,0,255
SolidColor=255,255,255,100
X=6
Y=7
W=318
H=38
Command1=["http://www.google.com/search?q=$UserInput$"] DefaultValue=""
Command2=[!SetVariable color.main "255,255,255,255"][!UpdateMeter "SearchLabel"][!UpdateMeter "SearchLabelOver"][!Redraw]
AntiAlias=1
FocusDismiss=1
UpdateDivider=-1

Just two more remarks about the code posted by you:

• Both the !Execute bang and the !Rainmeter... bang prefix was deprecated long time ago, you should have to not use them. Eg the in the MouseOverAction option of the [Rainmeter] section you should have to remove the red parts: MouseOverAction=[color=#FF0000]!execute[/color] [![color=#FF0000]Rainmeter[/color]HideMeter SearchLabel][![color=#FF0000]Rainmeter[/color]ShowMeter SearchLabelOver][![color=#FF0000]Rainmeter[/color]Redraw]. Removing them you'll get this: MouseOverAction=[!HideMeter SearchLabel][!ShowMeter SearchLabelOver][!Redraw].
• The AppVersion and the Author options, used into the [Rainmeter] section, was also deprecated, the last one being moved to the [Metadata] section.

[Va1ga]

Wow, that's cool, thanks for wasting your time helping me! I'm only a week engaged in the development of their own skin, I do not know much, and in English is not strong. Indeed, when sending a request, everything is returned to its place. The bug with disappearance is present only if you enter a query and do not press Enter, but click outside the area.