Editing TV Guide Help

[alibert]

Hi,

as Jaggy says, if you hav defined the font in the <Fonts> section of the skin, you can refer to this font by its name in the <Text ...> elements inside the "SelectedShowDetails_X" elements of the skin.

alibert

[gonzo90017]

I was only able to change the description for
<Element name="SelectedShowDetails_3" location="0,70.4" size="100,23" alpha="255">
But the text came out very small:

    <Text visible="!@insetVisible+!@hasPreviewImage" text="@description" location="18,23.6" size="80,76" font="AvalonType" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>
    <Text visible="!@insetVisible+@hasPreviewImage" text="@description" location="18,23.6" size="63,76" font="AvalonType" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>
    <Text visible="@insetVisible+!@hasPreviewImage" text="@description" location="30,23.6" size="68,76" font="AvalonType" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>
    <Text visible="@insetVisible+@hasPreviewImage" text="@description" location="30,23.6" size="51,76" font="AvalonType" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>

I couldn't change the font or color for the yellow description.
<Element name="SelectedShowDetails_1" location="0,70.4" size="100,23" alpha="255">
<Element name="SelectedShowDetails_2" location="0,70.4" size="100,23" alpha="255">
I changed the font to AvalonType (like I did for the description above) but here it didn't have any effect.

[Jaggy]

I was only able to change the description for
<Element name="SelectedShowDetails_3" location="0,70.4" size="100,23" alpha="255">
But the text came out very small:

That means (most likely) it is not picking up your font

I couldn't change the font or color for the yellow description.

This is the part that controls the title

    <Text visible="!@insetVisible" text="@header" location="18,3" size="66,20" font="Title" borderColor="Border2" outlineWidth="1" align="Left" valign="center" wrap="false" />
    <Text visible="@insetVisible" text="@header" location="30,3" size="54,20" font="Title" borderColor="Border2" outlineWidth="1" align="Left" valign="center" wrap="false" />

<Element name="SelectedShowDetails_1" location="0,70.4" size="100,23" alpha="255">
<Element name="SelectedShowDetails_2" location="0,70.4" size="100,23" alpha="255">
I changed the font to AvalonType (like I did for the description above) but here it didn't have any effect.

From memory I think it is this bit that controls which SelectedShowDetails element it uses (in your case element3) so 1 & 2 will have no affect for you

    <!-- the type of the channel header (1/2/3) -->
    <NamedValue name="ChannelHeaderType" value="1"/>

I will have a quick play around with it now & post the results in a little while......

[Jaggy]

First off..... Are you using the default skin? If so have you copied it & renamed it something else so updates won't overwrite you skin changes??

Right here's something for you to work with......

1, Copy your AvalonType fonts into your currently selected skin directory (that is "..\NPVR\Skin\Default" Not the TVListing directory)
2, Add the AvalonType fonts to the <Fonts> section of the TVListing skin (like this)

  <Fonts>
    <Font name="Listings" color="#fafafa" size="11.95" typeFace="DroidSans"/>
    <Font name="ListingsSelected" color="#080808" size="11.95" typeFace="DroidSans"/>

	<Font name="Title1Avalon" color="White" size="14.05" typeFace="AvalonType" style="Bold"/>
	<Font name="Title2Avalon" color="#1f8fff" size="13" typeFace="AvalonType"/>
	<Font name="DefaultSmallAvalon" color="#fafafa" size="11.95" typeFace="AvalonType"/>
  </Fonts>

3, Use this "SelectedShowDetails_3" & it will display like in the screen capture

  <Element name="SelectedShowDetails_3" location="0,70.4" size="100,23" alpha="255">
    <RoundedRect location="2,-8" size="96,108" fillColor="Guide_Description" borderColor="Transparent" radius="2.32" borderWidth="0"/>
    <Rect location="0,0" size="50,1.15" fillColor="Accent2_Horizontal_FadeIn"/>
    <Rect location="49.95,0" size="50.05,1.15" fillColor="Accent2_Horizontal_FadeOut"/>
    <Text visible="@hasPreviewImage" text="@shortPeriod" location="53.8,3" size="27,20" font="Title2Avalon" borderColor="Border2" outlineWidth="1" align="Right" valign="center" />
    <Text visible="!@hasPreviewImage" text="@shortPeriod" location="70,3" size="27,20" font="Title2Avalon" borderColor="Border2" outlineWidth="1" align="Right" valign="center" />
    <Image visible="@hasPreviewImage" source="@starRating" location="66.8,24" size="15,15" fixedAspectRatio="true"/>
    <Image visible="!@hasPreviewImage" source="@starRating" location="83,24" size="15,15" fixedAspectRatio="true"/>
    <Text visible="!@insetVisible" text="@header" location="18,3" size="66,20" font="Title1Avalon" borderColor="Border2" outlineWidth="1" align="Left" valign="center" wrap="false" />
    <Text visible="@insetVisible" text="@header" location="30,3" size="54,20" font="Title1Avalon" borderColor="Border2" outlineWidth="1" align="Left" valign="center" wrap="false" />
    <Text visible="!@insetVisible+!@hasPreviewImage" text="@description" location="18,23.6" size="80,76" font="DefaultSmallAvalon" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>
    <Text visible="!@insetVisible+@hasPreviewImage" text="@description" location="18,23.6" size="63,76" font="DefaultSmallAvalon" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>
    <Text visible="@insetVisible+!@hasPreviewImage" text="@description" location="30,23.6" size="68,76" font="DefaultSmallAvalon" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>
    <Text visible="@insetVisible+@hasPreviewImage" text="@description" location="30,23.6" size="51,76" font="DefaultSmallAvalon" borderColor="Border2" outlineWidth="1" align="left" wrap="true"/>
    <Image visible="!@insetVisible" source="@status" location="12.6,2" size="5,22" fixedAspectRatio="true"/>
    <Image visible="!@insetVisible" source="@extra1" location="12,25" size="5,13" fixedAspectRatio="false"/>
    <Image visible="!@insetVisible" source="@extra2" location="12,40" size="5,13" fixedAspectRatio="false"/>
    <Image visible="!@insetVisible" source="@extra3" location="12,54" size="5,13" fixedAspectRatio="false"/>
    <Image visible="!@insetVisible" source="@extra4" location="12,68" size="5,13" fixedAspectRatio="false"/>
    <Image source="@previewImage" fixedAspectRatio="true" location="81,2" size="17,96"/>
  </Element>

from there you should be able to get something like what you want, font sizes, postitions still need to be changed.... I find this page http://www.cryer.co.uk/resources/javascript/html2.htm very useful for finding colours (Note: if you are going to use colour Names they need to start with a capital letter)

[Jaggy]

At looking at that screen capture in my last message I'm not sure it is actually displaying the Title in bold so I looked at the AvalonType bold font & it has a different name to the other AvalonType fonts (I have never seen this before with other fonts) so you may need

	<Font name="Title1Avalon" color="White" size="14.05" typeFace="AvalonType Bold" style="bold"/>

to get the title to display in bold.

[Jaggy]

Did you ever get what you wanted from this?? The reason I'm asking is I still have the code above loaded in my test version so I could help you out if the need arose. If you have got it sorted out the way you want it or have given up on it I will revert back to my original TV Listings.xml.

[gonzo90017]

Sorry for the late reply. Thanks to your help i've been busy changing the fonts (among other things) on all the screens: TV Recordings, Mini Guide, etc. etc..

[Jaggy]

Good stuff, looks like you have got it sussed

Your next bit of fun will be when sub (or one of the plugin developers) releases the next version that has skin updates in it (which from his comments the next release will definitely have).

I make sure I have a copy of the current version of the default skin before I update, then after updating I look through the new default skin to see which skins have changed date (been updated) & what new skins have been added that I will need to add to my skin(s). For the ones that have been updated I used the "compare" feature in Notepad++ to find the changes.