logoText help in theme

paffley · 6 Apr 2018, 20:26

Hi, I'm creating a theme which has no logos and would like the system view to be text only.

At the moment the text logo's are black/centered.

I'm aware you can now edit this in ES themes as of:
https://github.com/RetroPie/EmulationStation/blob/master/THEMES.md#system-1
and
https://github.com/RetroPie/EmulationStation/blob/master/THEMES.md#theme-variables

But I'm struggling to achieve this in my theme.

This is what I have so far... (in main.xml)

<text name="logoText">
<color>ffffff</color>
<fontPath>./_inc/fonts/unicode.arialr.ttf</fontPath>
<fontSize>0.045</fontSize>
</text>

</view>

but nothing changes, color, size etc when restarting es.

Please could someone give me some pointers on how to add this into my main.xml

I would also like it to use the variable: system.fullName

Thank you in advance.

paffley · 6 Apr 2018, 20:42

Update: I now have this working but I don't believe the <alignment> tag is currently working with this. I was hoping for alignment left?

I still require help with setting the variable to system.fullName if anybody can point me in the right direction with my above code.

EctoOne · 6 May 2018, 00:20

The Docs state that logoText supports all settings. Unless you want to use it as system carousel element, then only FONT_PATH | COLOR | FORCE_UPPERCASE are supported.
I actually didn't knew that this was a thing, I have to take a look at it myself. Maybe I can add an actual carousel to my theme.

As for the variable, something like this works (taken from my text only Flatline theme):


 <text name="system_name" extra="true">
  <text>${system.fullName}</text>
  <fontPath>./_assets/${carouselFont}</fontPath>
  <color>${mainColor}</color>
  <forceUppercase>1</forceUppercase>
  <lineSpacing>1</lineSpacing>
  <alignment>center</alignment>
 </text>

You obviously have either to provide the some variables for the font path/color or replace it with whatever you want.

Edit: I just tried logoText as carousel and I don't really like it. It only uses the shortname. I tried to put an image over the selected system and on top of that the fullname variable text, but it looked ugly when carousel transitions are on, because the carousel scrolls under that image. It's fine with transitions turned off, but I like the fluid animation of the carousel.
Having the fullname text elsewhere on the screen looks weird too, at least on my theme.

EctoOne · 6 May 2018, 04:00

Did some more testing on the logoText thing and I only found one solution to make it, somewhat, good looking. But that requires to change all names in the es_systems.cfg. Yet, we still can really change the look of the text because we are limited to font/color/uppercase. One good thing is though, that it auto wraps long names, as long as it has a space in the name (tested it by changing snes to Super Nintendo Entertainment System).
So, it would be great if we could set all text attributes on system view (and have to edit es_systems.cfg) or a better solution would be if logoText could be overwritten and only fall back to the default value if no text is specified.
We could do something like this:
main.xml:

 <text name="logoText>
  <color>FFFFFF</color>
  <forceUppercase>1</forceUppercase>
  <lineSpacing>1</lineSpacing>
  <alignment>center</alignment>
 </text>

system/theme.xml:

 <text name="logoText">
  <text>Our Text here</text>
 </text>

I used that method to format some longer system names in my flatline theme. Although, in that case i use the text from any system/theme.xmlto overwrite the <text>${system.fullName}</text> that I have in my global theme.xml That would completely allow us to create a well formatted pure text theme without the need to edit es_systems.cfg

Maybe @jdrassa or somebody else of the devs can say if it would be possible to add my second solution.

jdrassa · 5 Jun 2018, 03:25

@ectoone We can't expose all of the text attributes because the carousel controls many of them. For example alignment can be set using the logoAlignment attribute of the carousel. We probably can support lineSpacing and text though. I will look into it.

EctoOne · 6 May 2018, 04:50

@jdrassa Oh yeah understandable, I wasn't even speaking of those. But now that you mentioned it, linespacing would be great to have (it was way too big when I did changed the name in my es_systems.cfg) and of course text would be necessary for what I was asking for. Thanks for looking into it. By the way, can you also take a look at this?

paffley · 6 May 2018, 12:53

Thanks @EctoOne @jdrassa I never knew about logoAlignment this is great. All I need now is to be able to display ${system.fullName} in the carousel itself.

This a brief theme of Pandoras Box (WIP) I'm porting across to ES in which i'm trying to acomplish with the logoText feature: (Apolagise for the poor photos)

EctoOne · 6 May 2018, 14:32

@paffley You can't use variables in the carousel, that's why I asked to add at least textas attribute to logoText. Then it would be possible to do that. Basically now logoText defaults to ${system.name} without the option to change it.

paffley · 6 May 2018, 16:02

@ectoone said in logoText help in theme:

@paffley You can't use variables in the carousel, that's why I asked to add at least textas attribute to logoText. Then it would be possible to do that. Basically now logoText defaults to ${system.name} without the option to change it.

Got ya! Thanks @EctoOne I'll see if any devs add it, I think it would make themes more flexible. I have about 5-6 that I would like to release but little niggles have stopped me from now, my OCD kicks in haha.

I believe the default should be ${system.fullName} imo, it makes more sense to the end user.

jdrassa · 6 Jun 2018, 03:06

I have submitted a PR adding theme support for text and lineSpacing forlogoText. It will likely be merged in a day or two. If you want to get an earlier look at it a Windows build is available for download here.

EctoOne · 6 Jun 2018, 06:37

@jdrassa Awesome, just did some quick testing and it works like a charm.

Edit: One last question for today: Why is image name="background" not available in system view? Seems weird to define an extra background image if I want to change it all views simultaneously.

paffley · 6 Jun 2018, 09:24

@jdrassa sweet thanks! :)

Stuart2773 · 6 Jun 2018, 11:03

@paffley

Looks like a really nice theme, personally i would change the font for something a bit more solid

paffley · 6 Jun 2018, 14:35

@stuart2773 said in logoText help in theme:

@paffley

Looks like a really nice theme, personally i would change the font for something a bit more solid

Hi @Stuart2773 yeh, ive had the same thoughts regarding the font type, on the original pandoras box the font has a stroke/ouline round the text, this cannot be achieved as yet in ES.
I'm basically trying to replicate the pandoras box 4s theme then after i've done that, I'm gonna put my own spin on it and make it 'Pandoras Box Pi' or something along those lines. I had to re-create the joystick and button in PS and use a different 'FREEPLAY' 'SELECT GAME' font as there is no where to find the exact font or artwork for Pandoras box, ive searched high and low. I've created the blue version which I prefer.

I also had to mod the background image to make it more 16.9 and modify the logo. if you look at the pandoras box on a 16.9 screen it stretches the logo, so ive made it look more crisp with the correct aspect ratio.

I've got some great ideas to put my spin on it like....in place of the '000' at the beginning of a title, place the consoles relevant gamepad there in the same yellow/orange gradient. got some more great ideas also.

I also love the fact you can place an image behind the game title now therefore re-creating the same effect as in pandoras box when you move up and down.

Stuart2773 · 6 Jun 2018, 14:42

@paffley

i cant wait to test this theme, i just love the look and simplicity of it.

great work :)

paffley · 6 Jun 2018, 13:38

@stuart2773 said in logoText help in theme:

@paffley

i cant wait to test this theme, i just love the look and simplicity of it.

great work :)

Thanks @Stuart2773 , ill keep updating it until my OCD stops haha :)
I never liked the pandoras box previously but I believe we can make it look more 'arcade' like and a bit more fun.

paffley · 6 Jun 2018, 13:42

@Stuart2773 on the original pandoras box, for some reason they use a green select bar on the blue version and a blue select bar on the green version, i personally think the green on green and blue on blue looks a lot better, that may be one of my spins i put on it. When I get round to releasing it I'll have a poll or maybe options to have vice versa etc.

paffley · 6 Jun 2018, 13:44

@jdrassa thanks for submitting the pr, as i dont use the windows version please could you let me know when its been added the the emu-dev on the pi. Thanks in advance.

Stuart2773 · 6 Jun 2018, 13:45

@paffley

i like both green & blue versions, you could make it optional or create 2 versions,

have you looked on the "hyperspin" forums, theres a few files on there that may help you.

paffley · 6 Jun 2018, 13:47

@stuart2773 said in logoText help in theme:

@paffley

i like both green & blue versions, you could make it optional or create 2 versions,

have you looked on the "hyperspin" forums, theres a few files on there that may help you.

Thanks @Stuart2773 I've had a brief look on there but could not see anything, have you seen something on there?