Some Thoughts on Creating New KML Scripts for Android-Emu48

[Giuseppe Donnini]

 
With the advent of Emu48 for Android, which opened the Android smartphone world to the best HP-48 emulator available, my real HP-48GX has gradually been superseded by a Samsung Galaxy—at least in everyday use. However, as much as I liked the technical advantages of the emulator, I wasn't happy with the look & feel of it: If I wanted to continue using it on a daily basis, something had to be done.

Unfortunately, nearly all KML packages available are a rather bad fit for smartphones, because they are not intended for full-screen use. I therefore decided to take matters into my own hands. After trying out several different designs, I finally settled on the following approach, which I wanted to share with the community.

My major design goal was to offer as close an experience as possible to using the real calculator, while maximizing the functional space, i.e. the display and keyboard areas in their strict sense.

This led to the following considerations.


1. Photo-Realistic Appearance.

The background bitmap should be based on an actual photograph of the calculator.

The choice of the LCD colors, though based on the real LCD, should emphasize readability and color balance, rather than reproduce a fully authentic, but otherwise hard-to-read, display.

The aspect ratio of the display should not be altered.

The aspect ratio of other parts, like the keyboard, might suffer a slight modification, as long as the distortion remains practically unnoticeable.



2. The Smartphone IS the Calculator.

There really is no need to preserve the bezel, nor any parts of the case other than the keys and their labels, since the smartphone itself will provide all these structural elements. This not only helps to maximize the functional space, but also enhances the realistic appearance, as the presence of any other part of the calculator will inevitably make it look like "a device within a device".



3. Aspect Ratio & Resolution.

Since the most common display resolution used on smartphones today seems to be WQHD/QHD with an aspect ratio of 9:16 and a resolution of 1440 x 2560 pixels, I used that as a starting point. Later, the same technique can be applied to other, less common, ratios.

To make sure the bitmap will be displayed exactly as intended, I decided to work with a 1:1 scaling factor, eliminating any interference from operations like auto-zoom, best-fit etc. This requires the following settings to be made in Emu48 for Android:

+----------------------------------------------+
|   Emu48 for Android Settings -- UI Section   |
+-------------------------+--------------------+
| Layout                  | None               |
| Rotation                | Portrait           |
| Allow to pinch to zoom  | OFF                |
| Overlapping LCD mode    | No Overlapping LCD |
| Hide the status bar     | ON                 |
| Hide the navigation bar | ON                 |
| Hide the button menu    | ON                 |
+-------------------------+--------------------+



4. Determining the Optimal Dimensions.


a. Display Area Width.

Since in portrait mode the limiting factor is the width, we have to determine that first: With a width of 131 pixels, the calculator's LCD fits 10 times into 1440 pixels, leaving two margins of 65 pixels on each side ( 1440 = 1310 + 2*65 ):


|65 |<----------------------------- 1310 px ----------------------------->| 65|
  .                                                                         .
  .                                                                         .
  .                                                                         .
|///|                                                                     |///|
|///|                                                                     |///|
|///|                                                                     |///|
| L |                                                                     | R |
| E |                                                                     | I |
| F |                             DOT MATRIX                              | G |
| T |                                                                     | H |
|///|                                                                     | T |
|///|                                                                     |///|
|///|                                                                     |///|
|///|                                                                     |///|
  .                                                                         .
  .                                                                         .
  .                                                                         .
|<--------------------------------- 1440 px --------------------------------->|



b. Display Area Height & Annunciators.

Given that the calculator's LCD is 64 pixels high, a zoom factor of 10 results in an emulated LCD height of 640 pixels. This, however, corresponds only to the dot-matrix area, to which must be added enough vertical space to accommodate for the annunciators.

The annunciators designed for this project are 16 pixels high, and were initially intended to be displayed together with a triple-size LCD (note that annunciators are not scaled by Emu48, but have to match—as they are—the specified zoom factor). After scaling, we obtain a height of ( 16/3 * 10 = ) 53 ⅓ pixels for a 10 times magnified LCD. Thus, adding 55 pixels of vertical space will work out just fine.

[ This is, by the way, consistent with Eric Rechlin's "Real Calcs" series, which are by far the best KML scripts available for non-full-screen use: therein 11-pixel-high annunciators are coupled with a zoom factor of 2, which would result in ( 11/2 * 10 = ) 55-pixel-high annunciators with a zoom factor of 10. ]

As for the upper and lower margins, experimentation showed that they do not need to be as large as the left and right margins, mainly for two reasons: First, because the annunciator area already constitutes a kind of margin, and second, because it is desirable to visually connect the softkeys on the keyboard to their labels on the bottom of the display.

Therefore, 30 pixels (instead of 65) are entirely sufficient to achieve a good visual balance. In the case of the upper margin, the pixels should best be distributed 2:1 above and below the annunciator area in order to avoid collision between the dot matrix and the annunciators.

Overall, this results in a final height of ( 20 + 55 + 10 + 640 + 30 = ) 755 pixels for the entire display area.


      -+-        ========================================          ---
 20 px |     ... ///////////// UPPER MARGIN ///////////// ...       ^
       |     ... ///////////// (First Part) ///////////// ...       |
      -+-        ----------------------------------------           |
       |                                                            |
       |                                                            |
 55 px |                       ANNUNCIATORS                         |
       |                                                            |
       |                                                            |
      -+-        ----------------------------------------           |
 10 px |     ... ////// UPPER MARGIN (Second Part) ////// ...       |
      -+-        ----------------------------------------           |
       |                                                            |
       |                                                            |
       .                                                       DISPLAY AREA
       .                                                          755 px
       .                                                            |
                                                                    |
640 px                          DOT MATRIX                          |
                                                                    |
       .                                                            |
       .                                                            |
       .                                                            |
       |                                                            |
       |                                                            |
      -+-        ----------------------------------------           |
       |     ... //////////////////////////////////////// ...       |
 30 px |     ... ///////////// LOWER MARGIN ///////////// ...       |
       |     ... //////////////////////////////////////// ...       v
      -+-        ========================================          ---
       |                                                            |
       |                                                            |
       .                                                            .
       .                      KEYBOARD  AREA                        .
       .                                                            .



c. Keyboard Area.

A 755-pixel high display area leaves ( 2560 - 755 = ) 1805 pixels in vertical direction for the keyboard area, whereas in horizontal direction, the full screen width of 1440 pixels remains available.


              |<--------- 1440 px ---------->|

        ---   +------------------------------+   ---
         ^    |                              |    ^           * : upper left
         |    |  *                           |    |               corner of the
         |    |         DISPLAY AREA         |    | 755 px        actual LCD
         |    |                              |    |               (i.e. dot
         |    |                              |    v               matrix) part
         |    +------------------------------+   ---
         |    |                              |    ^
         |    |                              |    |
         |    |                              |    |
         |    |                              |    |
2560 px  |    |                              |    |
         |    |                              |    |
         |    |                              |    |
         |    |        KEYBOARD  AREA        |    | 1805 px
         |    |                              |    |
         |    |                              |    |
         |    |                              |    |
         |    |                              |    |
         |    |                              |    |
         |    |                              |    |
         v    |                              |    v
        ---   +------------------------------+   ---



As discussed above, the original photograph of the calculator should be cropped so as to leave visible only the keys and their labels. Typically, the resulting image will have a width-to-height ratio (WHR) of about 0.685. Our calculated keyboard area, on the other hand, has a WHR of 1440/1805 = 0.798, which means that it is slightly too wide. However, we may safely scale the cropped image asymmetrically so as to fit the keyboard area (1440 x 1805) since the distortion factor will only be ( 0.798 / 0.685 = ) 1.16, which is more than acceptable.



d. KML Settings.

The dimensions established above translate into the following constant KML settings (note that offsets are zero-based):


Background
    Offset    0    0   # [If changed, Lcd Offset must be changed accordingly.]
    Size   1440 2560   # Width, Height.
End

Lcd
    Zoom    10         # Scale factor for the LCD (dot matrix).
    Offset  65 85      # Upper left corner of the dot matrix.
#   Color   ...
End



5. Implementations.

On the basis of the present guidelines I implemented a first set of twenty-three new KML scripts for the HP-48SX, named "SMART CHARLEMAGNE".

Time permitting, respective versions for the HP-48GX (SMART HAMMER) as well as for the HP-38G/G+ (SMART ELSIE) will soon follow.

[BruceH]

Bravo. These look fantastic.

[cdmackay]

thank you very much indeed!

[SammysHP]

This is awesome! These details, the colors and the comprehensive documentation! I wish you're already working on a 48GX (and 50g) KML!

PS: Would have been easier if the four threads for the 48SX were four posts in a single thread. Maybe a mod can merge them.

[Giuseppe Donnini]

(12-21-2019 08:22 AM)SammysHP Wrote:  Would have been easier if the four threads for the 48SX were four posts in a single thread. Maybe a mod can merge them.

While I was typing, I wanted to make sure no replies would appear in-between, but I guess you are right. However, if a moderator wants to change it, please take care of the non-breaking spaces (Alt+0160) in my posts, I'm not so sure they would survive a copy.

(12-21-2019 08:22 AM)SammysHP Wrote:  This is awesome! These details, the colors and the comprehensive documentation! I wish you're already working on a 48GX (and 50g) KML!

Thanks! SMART HAMMER is well under way and will feature my personal favorite: the HP-48SXII, or the HP-48GX as it should have been! Here's a small preview (take a close look, it's not an HP-48SX!):

[rprosperi]

(12-21-2019 06:24 PM)Giuseppe Donnini Wrote:  Thanks! SMART HAMMER is well under way and will feature my personal favorite: the HP-48SXII, or the HP-48GX as it should have been! Here's a small preview (take a close look, it's not an HP-48SX!):

Wow, I want a real one of these! Actually several. One of these with a black LCD would be the ideal HP machine. There are those who claim to prefer the 48SX layout over the 48GX, but I've always suspected it's really the color scheme more than the actual function locations that they don't like. Problem fixed.

Also, all these new KML layouts are beautiful Giuseppe, thanks so much for sharing them. I had been holding back on getting a larger Android phone (my current is 5.5") but these skins are a really good argument to move that way.

[John Keith]

(12-21-2019 08:14 PM)rprosperi Wrote:  Wow, I want a real one of these! Actually several. One of these with a black LCD would be the ideal HP machine. There are those who claim to prefer the 48SX layout over the 48GX, but I've always suspected it's really the color scheme more than the actual function locations that they don't like. Problem fixed.

And full hp 50 functionality including larger screen, please.