Draw a Box

re-Barr · 2010-04-03, 03:51 PM

I have been working on modding my blue skin and was wondering how do I draw a box. I wanted to draw a single box that would go behind the main menu items. I know that there is the ability to have boxes around each item in the list but I wanted just one large one for the whole list.

So far I have tried adding a placement in the menu skin and composit images in the menu skin as well as the baseskin. but I have had no luck. What am I doing wrong?

whurlston · 2010-04-03, 05:50 PM

Use an existing placement and composite image and just add a DrawRect or DrawRoundedRect to it. Here's an example using a modified TaskImage placement. Background mask is disabled.

Code:
<settings>

  <MenuType type="Centered2"/>

    <!-- name colors -->

    <NamedColors>            

        <NamedColor name="StandardFill" color="Black"/>            

    </NamedColors>        

    <!-- text style -->

    <TextStyles>

        <TextStyle name="MenuStyle" color="White" size="14"/>

    </TextStyles>

    <!-- placements -->

    <Placements>

<!--        <Placement name="MenuButtonOrigin" loc="55,25" scrollDuration="0.25" itemCount="5" withInsetX="75" offset="8.5" rightShift="true" alpha="200"/> -->

        <Placement name="MenuButtonOrigin" loc="55,23" scrollDuration="0.25" itemCount="7" withInsetX="75" offset="6.5" rightShift="true" alpha="200"/> 

        <Placement name="SelectedTaskDescription" loc="10,85" alpha="150"/>

        [B]<Placement name="TaskImage" loc="35,15" alpha="255"/>[/B]

        <Placement name="CurrentTime" loc="10,4" alpha="150"/>

        <Placement name="InsetRect" loc="7,20" size="53,53"/>

        <Placement name="ScreenBackgroundMask" loc="33.2,16" size="60,62.9"/>        

    </Placements>

    <!-- Animations -->

    <Animations>

        <Animation name="SwitchScreen" type="FadeThrough" duration="300"/>    

    </Animations>

  <!-- Panels -->

  <Panels>

    <Panel name="NowPlaying" enabled="true"/>

  </Panels>

    <!-- Composite Images -->    

    <CompositeImages>

        <CompositeImage name="ScreenBackgroundMask" size="60,66">

        [COLOR="lime"]<!--

            <DrawImage filename="background mask.png" loc="0,0" size="100,100"/>            

        -->[/COLOR]        </CompositeImage>

        [B]<CompositeImage name="TaskImage" size="30,65">

            <DrawRoundedRect loc="2,2" size="96,96" fillColor="Black" borderColor="White" radius="3" borderWidth="0"/>                 

        </CompositeImage>[/B]

        <CompositeImage name="SelectedTaskDescription" size="80,10">

            <DrawText text="@description" loc="0,0" size="100,100" textStyle="GeneralTextStyle" align="Center" valign="Top"/>

        </CompositeImage>

        <CompositeImage name="CurrentTime" size="80,5">

            <DrawText text="@currentTime" loc="0,0" size="100,100" textStyle="GeneralTextStyle" align="Center" valign="Center"/>

        </CompositeImage>

        <CompositeImage name="ButtonNormal" size="25.0,5.0">        

            <DrawText text="@buttonText" loc="7,5" size="100,100" textStyle="MenuStyle" align="Left"/>

        </CompositeImage>

        <CompositeImage name="ButtonSelected" size="25.0,5.0">      

            <DrawText text="@buttonText" loc="7,5" size="100,100" textStyle="MenuStyle" align="Left"/>

        </CompositeImage>

    </CompositeImages>             

</settings>

re-Barr · 2010-04-07, 04:41 AM

DOH! I had tried something like that before but it didn't work... Guess I messed it up somehow, because this worked and I have tweaked it to my liking. Thanks for the help.