问题
I'm using MultiView with some TButton buttons in Firemonkey. The multiView is opaque at 0.5 and this causes the buttons to also be opaque.
QUESTION: Is there a way to prevent MultiView opacity from affecting the button texts? That is, the text of the buttons would continue with bright colors, but the "body" of the buttons would be opaque. I've seen some applications with this visual feature, but I do not know what components were used for that purpose ...
回答1:
Instead of the TMultiView
, use a TRectangle
as basis for the menu. Set its Align
to left and the Fill.Color
to $7FFFFFFF
. The two first hex digits (7F) define the alpha channel (translucency), the rest of the hex digits (FFFFFF), define the RGB colors. This allows you to leave the Opacity
at one, but still having the translucent effect. This is not possible with the TMultiView
control.
For each item, use a TLayout
, with a TImage
and a TText
and any separator lines you like. Use normal Align
properties to setup the items.
Finally, set HitTest = True
for the TLayout
and HitTest = False
for the TImage
and TText
controls. This is to enable mouse clicks or taps.
Below is my test, both as .fmx
content (image data removed) and a snapshot.
object Rectangle1: TRectangle
Align = Left
Fill.Color = x7FFFFFFF
Size.Width = 200.000000000000000000
Size.Height = 210.000000000000000000
Size.PlatformDefault = False
object Layout1: TLayout
Align = Top
HitTest = True
Size.Width = 200.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
TabOrder = 0
object Image1: TImage
MultiResBitmap.Height = 128
MultiResBitmap.Width = 128
MultiResBitmap = <
item
Width = 128
Height = 128
PNG = {}
FileName = 'C:\tmp\Imgs\0.bmp'
end>
Align = Left
end
object Text4: TText
Align = Left
Position.X = 50.000000000000000000
Size.Width = 151.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
Text = 'Zero Hero'
TextSettings.Font.Size = 21.000000000000000000
TextSettings.Font.StyleExt = {00070000000000000004000000}
TextSettings.FontColor = claDarkblue
end
end
object Layout2: TLayout
Align = Top
HitTest = True
Position.Y = 50.000000000000000000
Size.Width = 200.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
TabOrder = 1
object Image2: TImage
MultiResBitmap.Height = 128
MultiResBitmap.Width = 128
MultiResBitmap = <
item
Width = 128
Height = 128
PNG = {}
FileName = 'C:\tmp\Imgs\1.bmp'
end>
Align = Left
end
object Text5: TText
Align = Left
Position.X = 50.000000000000000000
Size.Width = 151.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
Text = 'One More'
TextSettings.Font.Size = 21.000000000000000000
TextSettings.Font.StyleExt = {00070000000000000004000000}
TextSettings.FontColor = claDarkblue
end
end
object Layout3: TLayout
Align = Top
HitTest = True
Position.Y = 100.000000000000000000
Size.Width = 200.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
TabOrder = 2
OnClick = Layout3Click
OnMouseDown = Layout3MouseDown
object Image3: TImage
MultiResBitmap.Height = 128
MultiResBitmap.Width = 128
MultiResBitmap = <
item
Width = 128
Height = 128
PNG = {}
FileName = 'C:\tmp\Imgs\2.bmp'
end>
Align = Left
HitTest = False
end
object Text6: TText
Align = Left
HitTest = False
Position.X = 50.000000000000000000
Size.Width = 150.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
Text = 'Double Joy'
TextSettings.Font.Size = 21.000000000000000000
TextSettings.Font.StyleExt = {00070000000000000004000000}
TextSettings.FontColor = claDarkblue
end
end
object Layout4: TLayout
Align = Top
HitTest = True
Position.Y = 150.000000000000000000
Size.Width = 200.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
TabOrder = 3
object Image4: TImage
MultiResBitmap.Height = 128
MultiResBitmap.Width = 128
MultiResBitmap = <
item
Width = 128
Height = 128
PNG = {}
FileName = 'C:\tmp\Imgs\3.bmp'
end>
Align = Left
HitTest = False
end
object Text1: TText
Align = Left
HitTest = False
Position.X = 50.000000000000000000
Size.Width = 151.000000000000000000
Size.Height = 50.000000000000000000
Size.PlatformDefault = False
Text = 'Triple Fun'
TextSettings.Font.Size = 21.000000000000000000
TextSettings.Font.StyleExt = {00070000000000000004000000}
TextSettings.FontColor = claDarkblue
end
end
end
回答2:
I don't think you can. But you can achieve the effect by putting a blank button as a child of the multiview and adding a separate TText object as a child of the form (or other object with absolute opacity of 1) as shown in the screen shot below. It is not ideal if the button can move or resize for example, but this can be overcome by creating, say, a TPanel, making the the Multiview and text separate children of that, and then using the panel for moving and resizing purposes, which will ensure that the button and its associated text stay in step.
Edit
In light of Tom Brunsberg's comments I would suggest making both a child of a TPanel, rather than of a TForm. Certainly in my tests the issues he mentions of the TText going to the back do not occur when this is done. He is perfectly correct about setting HitTest to false for the TText object.
来源:https://stackoverflow.com/questions/47585746/how-to-prevent-multiview-opacity-from-affecting-children-components-texts-in-del