Shoutbox

[HELP] Images In Options - Printable Version

-Shoutbox (https://shoutbox.menthix.net)
+-- Forum: MsgHelp Archive (/forumdisplay.php?fid=58)
+--- Forum: Messenger Plus! for Live Messenger (/forumdisplay.php?fid=4)
+---- Forum: Skinning (/forumdisplay.php?fid=41)
+----- Thread: [HELP] Images In Options (/showthread.php?tid=89037)

[HELP] Images In Options by stuartbennett on 02-08-2009 at 01:43 PM

as you can see from the image below in my options panel for 365 skin i have a load of checkboxes and next to them i have text descriptions, what i am seeing a lot of in option panels nowadays is those text descriptions are replaced with images now i think i know how to change all those text descriptions into images and have alt text so the text description shows when you hover over them but there are skins with a rather fancy technology which works as follows:

[Image: SkinOptions-3.png]

when you have options to say show or hide a button if you set the checkbox to hide it then the image of the button will appear with a red circle with a diagnal red line through it like you see in a no smoking sign but the button icons there instead of the cigarette, if you set to show the button this red circle disappears and you see just the normal button image, does anyone know how this is done?

the reason i want to be able to do this is so i have more available space in my options panel so i can later add more exciting options in to 365.


RE: [HELP] Images In Options by DennisMartijn on 02-08-2009 at 05:35 PM

It is done by carefully placing these images.
Use the top and left positions of the text, and the width of the images themselves.

Add <DispHelp> tags to the image elements to get the hover text.

Also, you might want to move the checkboxes to the right of the pictures after importing:
[image][checkbox]

this looks a little bit clearer to most people.


RE: [HELP] Images In Options by stuartbennett on 02-08-2009 at 05:51 PM

dennismartijn

below is the screenshot of how my skin options looks now

[Image: SkinOptions.png]

as you can see ive got the images in place of the text like i wanted, what im trying to acheive is if the show mail button checkbox is ticked it will show mail1.png but if it isnt ticked itll show mail2.png in its place, how is that acheived?


RE: [HELP] Images In Options by DennisMartijn on 02-08-2009 at 06:03 PM

I dont think that is possible. But I have not seen it before, I might be wrong.

Good job on the first part though.

I suggest you should make clear that when these image options are selected, the elements will be hidden. It now looks like when these image options are selected, they will be viewed, but actually they will be hidden.

You should make a header like "Hide", so people understand they will hide the selected options.


RE: [HELP] Images In Options by Basilis on 02-08-2009 at 06:26 PM

It was done in the stormless Messenger skin by mynetx. He is a scripter and he knows more about the interfaces of Plus! because scripts can use more advanced techniques in their settings windows than skins.


RE: RE: [HELP] Images In Options by stuartbennett on 02-08-2009 at 06:32 PM

quote:
Originally posted by DennisMartijn
I dont think that is possible. But I have not seen it before, I might be wrong.

Good job on the first part though.

I suggest you should make clear that when these image options are selected, the elements will be hidden. It now looks like when these image options are selected, they will be viewed, but actually they will be hidden.

You should make a header like "Hide", so people understand they will hide the selected options.

thats the reason for the state based images, if you untick one of these buttons then its going to be hidden so if a buttons checkbox is unticked i want it to display the buttons image with a disabled symbal overlayed on it, if the option is enabled that disabled symbal then disappears, now i found this in the skin crystal lab, what has been done in that skins is when you define the checkbox control under the place where you put the position tags you put in a custom look tag they have 1 image to set the look of the checkboxes and another for the icon image, theres 4 states normal, hot, puched and hover each of them has sections for checked and unchecked and its in those you place your custom image elements.

i did think it might be that but i was hoping there might be an easier way to do it that im not aware of.
RE: [HELP] Images In Options by DennisMartijn on 02-08-2009 at 06:54 PM

Since I have no clue about that, I think the best to do is just use the code from Crystal Lab. Since it is basic Plus! code, it is not ripping.


RE: [HELP] Images In Options by stuartbennett on 02-08-2009 at 08:01 PM

ok thanks dennis.


RE: [HELP] Images In Options by blessedguy on 02-08-2009 at 10:13 PM

Well, taking a look at the code, you can see:

xml code:
<Control xsi:type="CheckBoxControl" Id="RLnk">
                <Position Top="50" Width="50" Left="4" />
                <Help>Hide/Show links on logon window</Help>
                <CustomLook>
                    <Normal>
                        <Unchecked>
                            <Element xsi:type="ImageElement" Id="Lnk01">
                                <Position Top="1" Left="0" Height="100" />
                                <Image>
                                    <Name>normal</Name>
                                </Image>
                            </Element>
                            <Element xsi:type="TextElement" Id="Lnk02">
                                <Position Top="2" Left="11" />
                                <Color>
                                    <GlobalColor>text</GlobalColor>
                                </Color>
                                <Font>
                                    <Size>7</Size>
                                </Font>
                                <Text>Links</Text>
                            </Element>
                        </Unchecked>
                        <Checked>
                            <Element xsi:type="ImageElement" Id="Lnk03">
                                <Position Top="1" Left="0" />
                                <Image>
                                    <Name>normal2</Name>
                                </Image>
                            </Element>
                            <Element xsi:type="TextElement" Id="Lnk04">
                                <Position Top="2" Left="11" />
                                <Color>
                                    <GlobalColor>text</GlobalColor>
                                </Color>
                                <Font>
                                    <Size>7</Size>
                                </Font>
                                <Text>Links</Text>
                            </Element>
                        </Checked>
                    </Normal>
                </CustomLook>
            </Control>
(Removed other "styles")
So, what he has done, was just using <CustomLook> to use different themes, <Normal> as theme (there were other ones), <Checked> and <Unchecked> for ticket and unticket boxes. Think now you can do it! =)
And the options window was done by skinning Messenger Plus! itself btw.
RE: [HELP] Images In Options by stuartbennett on 02-09-2009 at 07:44 AM

i knew how to do option windows and after investigating i saw how to do the above but setting for 4 seperate states (normal, hot, pushed & clicked) is a bit overkill, i just really wanted to be able to do the checked and unchecled without having to worry about setting a specific state but i guess i dont have a choice.

ok thanks blessedguy.


RE: [HELP] Images In Options by DennisMartijn on 02-09-2009 at 04:16 PM

Thanks from me aswell, I didn't know this was possible within plus! itself.


RE: RE: [HELP] Images In Options by stuartbennett on 02-09-2009 at 04:29 PM

quote:
Originally posted by DennisMartijn
Thanks from me aswell, I didn't know this was possible within plus! itself.

not a problem dennis, i am glad that my query has helped you, although i have coded in this effect yet i have atleast finished changing text in options to icons and the result is shown below.

[Image: SkinOptions-1.png]

as you can see its a lot nicer and more spacious than before, i may not yet have figured out the new style and definition files but while i am waiting for willz to redo his guides to explain them better i might as well spend time building the best options panel i can possibly create.

EDIT:

youll notice that handwriting formating toolbar and input toolbar dont yet have icons next to there checkboxes, unfortunately input toolbar is the send and search buttons from the chat window so i need to screenshot them to do those, as for the HFT section, i have those icons but i beleive theres more buttons there than i have listed so i need to reconfigure that section before i add any icons to it so that i can group them properly.

when 365 is eventually ready for release it will be one hell of a skin of that you can be sure.
RE: [HELP] Images In Options by DennisMartijn on 02-12-2009 at 04:11 PM

it looks great, although I cant tell yet what a selected item does. For example, at the Contact List Toolbar part, there are a few selected and a few not selected items, yet I can't tell which effect it has. Will selected appear, or will they be hidden? If you could just use Inactive / Disabled pictures for selected items, then it will be the best option panel style so far.


RE: RE: [HELP] Images In Options by stuartbennett on 02-15-2009 at 01:52 PM

quote:
Originally posted by DennisMartijn
it looks great, although I cant tell yet what a selected item does. For example, at the Contact List Toolbar part, there are a few selected and a few not selected items, yet I can't tell which effect it has. Will selected appear, or will they be hidden? If you could just use Inactive / Disabled pictures for selected items, then it will be the best option panel style so far.

Denniss

as you can now see from the screenshot below if the box is ticked then it hides the button, if unticked the button will be visible.

[Image: SkinOptions-2.png]

finally figured out how to get one button working and when i tried to do the others they dont work, anybody know whats wrong my code is shown below.

quote:
                    <Control xsi:type="CheckBoxControl" Id="RemInviteBtn">
                        <Position Top="39" Width="10" Left="150"/>
                        <Help>Remove Invite Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>150</Left>
                                <Top>39</Top>
                                <Right>174</Right>
                                <Bottom>50</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="InviteBtn1">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Invite</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="InviteBtn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="InviteBtn3">
                                        <Position Top="0"  Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Invite X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="InviteBtn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="InviteBtn5">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Invite</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="InviteBtn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="InviteBtn7">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Invite X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="InviteBtn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="InviteBtn9">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Invite</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="InviteBtn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="InviteBtn11">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Invite X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="InviteBtn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>
                    <Control xsi:type="CheckBoxControl" Id="RemSharedBtn2">
                        <Position Top="39" Width="10" Left="174"/>
                        <Help>Remove Sharing Folders Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>174</Left>
                                <Top>39</Top>
                                <Right>198</Right>
                                <Bottom>50</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="Share2Btn1">
                                        <Position Top="0" Left="22" Height="50"></Position>
                                        <Image>
                                            <Name>Sharing Folders 2</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Share2Btn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="Share2Btn3">
                                        <Position Top="0"  Left="22" Height="50"></Position>
                                        <Image>
                                            <Name>Sharing Folders 2X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Share2Btn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="Share2Btn5">
                                        <Position Top="0" Left="22" Height="50"></Position>
                                        <Image>
                                            <Name>Sharing Folders 2</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Share2Btn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="Share2Btn7">
                                        <Position Top="0" Left="22" Height="50"></Position>                                        <Image>
                                            <Name>Sharing Folders 2X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Share2Btn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="Share2Btn9">
                                        <Position Top="0" Left="22" Height="50"></Position>                                        <Image>
                                            <Name>Sharing Folders 2</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Share2Btn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="Share2Btn11">
                                        <Position Top="0" Left="22" Height="50"></Position>                                        <Image>
                                            <Name>Sharing Folders 2X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Share2Btn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>
                    <Control xsi:type="CheckBoxControl" Id="RemWebcamBtn">
                        <Position Top="39" Width="10" Left="198"/>
                        <Help>Remove Webcam Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>198</Left>
                                <Top>39</Top>
                                <Right>210</Right>
                                <Bottom>50</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn1">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Webcam</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn3">
                                        <Position Top="0"  Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Webcam X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn5">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Webcam</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn7">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Webcam X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn9">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Webcam</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn11">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Webcam X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="WebcamBtn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>
                    <Control xsi:type="CheckBoxControl" Id="RemCallBtn">
                        <Position Top="39" Width="10" Left="222"/>
                        <Help>Remove Call Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>222</Left>
                                <Top>39</Top>
                                <Right>234</Right>
                                <Bottom>50</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="Call2Btn1">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Call</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Call2Btn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="Call2Btn3">
                                        <Position Top="0"  Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Call X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Call2Btn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="Call2Btn5">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Call</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Call2Btn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="Call2Btn7">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Call X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Call2Btn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="Call2Btn9">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Call</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Call2Btn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="Call2Btn11">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Call X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="Call2Btn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>
                    <Control xsi:type="CheckBoxControl" Id="RemActivityBtn">
                        <Position Top="50" Width="26" Left="150"/>
                        <Help>Remove Activites Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>150</Left>
                                <Top>50</Top>
                                <Right>174</Right>
                                <Bottom>61</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="ActBtn1">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Activities</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ActBtn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="ActBtn3">
                                        <Position Top="0"  Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Activities X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ActBtn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="ActBtn5">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Activities</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ActBtn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="ActBtn7">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Activities X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ActBtn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="ActBtn9">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Activities</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ActBtn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="ActBtn11">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Activities X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ActBtn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>
                    <Control xsi:type="CheckBoxControl" Id="RemGamesBtn">
                        <Position Top="50" Width="10" Left="174"/>
                        <Help>Remove Games Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>174</Left>
                                <Top>50</Top>
                                <Right>198</Right>
                                <Bottom>61</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="GamesBtn1">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Games</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="GamesBtn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="GamesBtn3">
                                        <Position Top="0"  Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Games X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="GamesBtn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="GamesBtn5">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Games</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="GamesBtn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="GamesBtn7">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Games X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="GamesBtn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="GamesBtn9">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Games</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="GamesBtn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="GamesBtn11">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Games X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="GamesBtn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>
                    <Control xsi:type="CheckBoxControl" Id="RemBlockBtn">
                        <Position Top="50" Width="10" Left="198"/>
                        <Help>Remove Block Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>198</Left>
                                <Top>50</Top>
                                <Right>210</Right>
                                <Bottom>61</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="BlockBtn1">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Block</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="BlockBtn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="BlockBtn3">
                                        <Position Top="0"  Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Block X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="BlockBtn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="BlockBtn5">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Block</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="BlockBtn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="BlockBtn7">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Block X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="BlockBtn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="BlockBtn9">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Block</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="BlockBtn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="BlockBtn11">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Block X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="BlockBtn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>
            <Control xsi:type="CheckBoxControl" Id="RemColorizeBtn2">
                        <Position Top="50" Width="10" Left="222"/>
                        <Help>Remove Colorize Button (CT)</Help>
                        <CustomLook>
                            <FocusRect>
                                <Left>222</Left>
                                <Top>50</Top>
                                <Right>234</Right>
                                <Bottom>61</Bottom>
                            </FocusRect>
                            <Normal>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn1">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Colorize</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn2">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn3">
                                        <Position Top="0"  Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Colorize X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn4">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>normal2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Normal>
                            <Hot>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn5">
                                        <Position Top="0" Left="11" Height="50"></Position>
                                        <Image>
                                            <Name>Colorize</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn6">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover</Name>
                                        </Image>
                                    </Element>   
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn7">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Colorize X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn8">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>hover2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Hot>
                            <Pushed>
                                <Unchecked>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn9">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Colorize</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn10">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press</Name>
                                        </Image>
                                    </Element>
                                </Unchecked>
                                <Checked>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn11">
                                        <Position Top="0" Left="11" Height="50"></Position>                                        <Image>
                                            <Name>Colorize X</Name>
                                        </Image>
                                    </Element>
                                    <Element xsi:type="ImageElement" Id="ColorizeBtn12">
                                        <Position Top="1" Left="0" />
                                        <Image>
                                            <Name>Press2</Name>
                                        </Image>
                                    </Element>
                                </Checked>
                            </Pushed>
                        </CustomLook>
                    </Control>


RE: [HELP] Images In Options by Menthix on 02-15-2009 at 02:02 PM

quote:
Originally posted by stuartbennett
if the box is ticked then it hides the button, if unticked the button will be visible
I expected it the other way around. Certainly because I've seen other skins do the opposite. A little text like (check to hide) would be helpful.
RE: RE: [HELP] Images In Options by stuartbennett on 02-15-2009 at 02:42 PM

quote:
Originally posted by MenthiX
quote:
Originally posted by stuartbennett
if the box is ticked then it hides the button, if unticked the button will be visible
I expected it the other way around. Certainly because I've seen other skins do the opposite. A little text like (check to hide) would be helpful.

well i may yet do it the other way round, im yet to actually do the hard coding to make the options work in 9.0 i was mainly just trying to get a working conceptual design going in the skin options panel so everyone can atleast get a feel for whats coming.

i can put in a little comment somewhere explainng tick to hide or tick to show depending on whiich way round i decide to do it, i may also change the alt text to "show / hide activities button (CT)" thats just an example btw.

thing is im struggling to get this new effect working, any idea what ive done wrong menthix?

EDIT:

another cool idea i just thought of which i dont think anyones done yet, in crystal lab the checkboxs for things like links, help button, text background etc, they have the custom checkboxes through customlook but i could take that further so that if the links are enabled then its plain text but if they are disabled then the text turns red and has a strikethrough effect to indicate its turned off. what do you think?