Help with UI and views.

[SteveIves]

I'm trying to put a UI on a classic 'Star Trek' game written in Python.

To start with, I want a full-screen background onto which I can put my long-range scanner, my short range scanner, a command menu and perhaps some other boxes.

Would I create a full-screen ui.view for the background and then ui.view subviews for the scanners etc?

Thanks,

Steve

[dgelessus]

If you're writing some kind of full-screen game, you should probably use the scene module instead of ui. scene works based on a render loop (i. e. a draw method is called 60 times per second) and has features like layers (with animation and image support) and touch events. The ui module is intended for native iOS GUIs, with elements like buttons, lists, sliders, text fields, web content, etc. It is possible to use scene graphics inside a UI using the scene.SceneView, but I'd suggest starting with a pure scene-based program unless you absolutely need somthing like text input.

What exactly would you call a "classic Star Trek game"? Do you mean a text-based adventure with graphical elements, or a graphical-only point-and-click game, or something else?

[SteveIves]

Hi. no, this is basically the original text-based Star Trek with text input and output. the UI I'm aiming for is something like this :

so you enter your move as text and the status of the universe is then updated and the screen re-drawn.

[SteveIves]

The current version, which runs under Pythonista, looks like this :

When you enter your command, the game's status is simply printed as text and everything scrolls up, and you are then prompted to enter your command again.

[ccc]

Do you have the code that drives this UI or are you planning to rewrite it from scratch?

[JonB]

if you want the sort of persistent heads up display, it would be possible to implement each region of the ui as either text, or even something like a table view. those commands could be implemented as buttons, etc. the ui designer might help to lay out the general format.

if you want to stick to text, you can add a bit of old school flair by using some ascii(Unicode) art.

'''wrap some text in an ascii box.
optionally specify width and height to fill.

example: 
>>> print makebox('four score and seven years ago...',15,7)
╔═══════════════╗
║four score and ║
║seven years    ║
║ago...         ║
║               ║
║               ║
║               ║
║               ║
╚═══════════════╝
   
'''
def makebox(text,width=25,height=12):
   s=textwrap.fill(text,width).split('\n')

   return (u'\u2554'+width*u'\u2550'+u'\u2557\n'
      +height*(u'\u2551'+'{'+':{}'.format(width)+'}'+u'\u2551\n')
      +u'\u255a'+width*u'\u2550'+u'\u255d\n').format(*(s+(height-len(s))*['']))

[JonB]

strange... this prints fine on pc and in pythonista, but Safari doesn't format fixed font spaces correctly... but anyway, you have the whole Unicode to use to represent various things on the map for example, including emoji, though if I recall you will need to use the Unicode character for the emoji, rather than the emoji kb. 🚀✨🌞🌍

[dgelessus]

As long as you add the line

# -*- coding: utf-8 -*-

at the top of the file, you can use Unicode characters inside Unicode string literals. Without the encoding line Python throws a SyntaxError, because UTF-8 multibyte characters are not ASCII.

If you're working in the interactive console, things are a little different. Input characters are always encoded as UTF-8, even inside Unicode literals. For example, the literal u"ä" incorrectly becomes u"\xc3\xa4". The correct value would be u"\xe4". This means that to use Unicode characters in the console, you need to either use escapes or manually decode the UTF-8 bytes: "ä".decode() correctly becomes u"\xe4".