HP Forums
PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Printable Version

+- HP Forums (https://www.hpmuseum.org/forum)
+-- Forum: HP Calculators (and very old HP Computers) (/forum-3.html)
+--- Forum: HP Prime (/forum-5.html)
+--- Thread: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool (/thread-859.html)



PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-08-2014 11:35 PM

Several months ago the user "Juju" published a very nice image of a skin editor, but it was never completed, nor exe was released. My version is of course inspired in https://github.com/juju2143/hpcalcskincreator from Juju, it allows the user to create or edit any skin (Prime and 39gII); some features:

-Mouse controls for resizing, selecting and dragging
-Property panel to edit any value precisely
-Change the skin image
-Automatic border finder
-Editor supports all elements in the skin file: keys, the screen and "maximize" regions (used when the emulator is maximized)
-Support for undo/redo skin changes

Download v0.4 b1 (updated 2014-03-19):
http://servicios.ried.cl/primecomm/ <- built-in the setup

Source:
https://github.com/eried/PrimeComm/tree/master/PrimeSkin

[Image: Image%202014-03-16%20at%203.23.20%20PM.png]
______________________________

While developing the editor, I ended updating some of the descriptions in this wiki for future reference: http://tiplanet.org/hpwiki/index.php?title=HP_Prime/Skins

How to create a wacky skin for the emulator in under 7 minutes from scratch (in spanish):





RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-09-2014 11:48 PM

OK, the version 0.1 b2 now includes all the basic functions. This version can edit and save skins. The border feature isn't working yet (finding the border of the image is not so trivial and the skin view is only to select and preview the buttons, no mouse-modifications yet).

Also, it works in Linux (tested by an Argentinian so it must be true, che boludo!) and Mac (installing the mono-runtime, or installing mono-complete and running
Code:
mkbundle --deps -o primeskin PrimeSkin.exe
to create a self contained executable that does not require the mono installation):
[Image: 2014-03-09_1944.png]


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - jebem - 03-10-2014 09:22 PM

Nice work!
I will have a try one of these days.


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-12-2014 05:36 PM

How to create a wacky skin for the emulator in under 7 minutes from scratch (in spanish):
https://www.youtube.com/watch?v=ceefXfVKQWE

[Image: Image%202014-03-12%20at%201.33.49%20PM.png]


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Tim Wessman - 03-12-2014 08:14 PM

Very nice. That tool looks very familiar for some reason... :-)

Well, just noticed that the version I looked at didn't have the drag things for the keys. That was the most useful thing for our tool.

Also, you may not yet be handling the "maximized" area. That is where you specify which part of the bitmap appears next to the large screen. Note that there can be either a single one, or two that are combined. I've attached a zip file with a "horizontal prime" skin that shows how that works properly if you' don't have one that does that yet.

[attachment=373]


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-12-2014 08:21 PM

(03-12-2014 08:14 PM)Tim Wessman Wrote:  Very nice. That tool looks very familiar for some reason... :-)

With ours, I discovered the most useful thing was being able to drag boxes for the keys around to reposition. The edges we handled with drag handles at the points, but maybe you've figured out something better.

Heheh, well this is just the cheap way to do the resize controls (I tried to avoid coding all the conditions for the edges).

I see few artifacts in the original skins, maybe they can get a little makeover for next release:
1) few buttons oversized http://cl.ly/UNrx http://cl.ly/UNdm http://cl.ly/UNkg lots here: http://cl.ly/UOFG
2) Ugly borders (mainly because the border in the image isn't perfect): http://cl.ly/UOXz


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Tim Wessman - 03-12-2014 08:27 PM

Just tried the new version. Even better then ours! The primary reason that border wasn't clean was mainly because I had to do it by hand and didn't want to waste the time... :-)

I do note the original "compact" skin seems to mess up the "rebuild from background" output.


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-12-2014 08:36 PM

(03-12-2014 08:27 PM)Tim Wessman Wrote:  Just tried the new version. Even better then ours! The primary reason that border wasn't clean was mainly because I had to do it by hand and didn't want to waste the time... :-)

I do note the original "compact" skin seems to mess up the "rebuild from background" output.

hahaha sounds fair!, the border algorithm fails because there is no border to find in that image :O (I ended implementing this: http://en.wikipedia.org/wiki/Marching_squares to avoid bulkiness like opencv or anything like that, so it requires some kind of difference between border and image. Probably for the compact image "Reset" is the proper border)


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Tim Wessman - 03-12-2014 09:25 PM

Makes sense as to why it failed. I wasn't sure if you were expecting it to work so figured I'd report it.

Also,there may very well be things in there that we don't use any more (fg/bg color comes to mind).


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-12-2014 10:51 PM

(03-12-2014 08:14 PM)Tim Wessman Wrote:  Very nice. That tool looks very familiar for some reason... :-)

Well, just noticed that the version I looked at didn't have the drag things for the keys. That was the most useful thing for our tool.

Also, you may not yet be handling the "maximized" area. That is where you specify which part of the bitmap appears next to the large screen. Note that there can be either a single one, or two that are combined. I've attached a zip file with a "horizontal prime" skin that shows how that works properly if you' don't have one that does that yet.

I didn't noticed that maximized mode before :-O I will have to think how to include it seamlessly. Including the screen with the keys was pushing it a bit far, maybe I can do all them as "regions" and keep the keys in another section.


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-13-2014 05:03 PM

There is something wrong with "Horizontal Prime", I was adding these maximized regions to my editor and I noticed how the first region is weirdly shaped:

[Image: Image%202014-03-13%20at%2012.54.51%20PM.png]

Height is 500, and Y is 260, so it is way over the skin, of course it seems to be defining an area (hence any position would work) but when maximizing the emulator you can't press any key in the right side, and after clicking few times the emulator hangs.

Is this maximized1, maximized2, etc. something for a future version?

BTW, here is how the editor handles these maximized regions Big Grin





RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Tim Wessman - 03-13-2014 05:29 PM

>Is this maximized1, maximized2, etc. something for a future version?

Nah, that has been there since the 39gII days where there was a similar horizontal skin. I'll look at the numbers I've got there with regards to the complaint about it not working. It seemed like it was just fine last time I used it.


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-13-2014 06:00 PM

Maybe 39gII users never tried that maximized mode. Since the window is not resizable, I just omitted thinking it was maximizable.

You have to use your horizontal skin, green area hangs the emulator, red area does not work, other buttons work but they are a offsetted.
http://screencast.com/t/BS0RwhywwPbH

Edit: It seems to be related with the resolution, the "hang" spot is a little lower in my laptop (like in the center) and the keys work


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Juju - 03-14-2014 03:47 AM

Hey there!

Glad you did something interesting out of my code, I proably couldn't do better. So yeah, this summer I posted screenshots of the app, but never really got around to release something for some reason until user eried emailed me about it (probably because I moved on to something else and nobody really bothered me to release it) and I found the code somewhere on my hard drive and released it on GitHub.

So yeah, good job here!


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Tim Wessman - 03-14-2014 03:07 PM

Hi,

Here are some more details about the maximized things. I had to go take a look at it since its been a long time...

maximized= total size of the displayed keyboard region in maximized mode. Basically, the width and summed y values if the max1/max2 are the same width.

maximized1=size of region 1 to copy. The last two parameters are the "offset" to the maximized1 area. Basically, this is pointing back to the original position keyboard location.

maximized2=size of region 2 to copy. The last two parameters are the "offset" to the maximized2 area. Basically, this is pointing back to the original position keyboard location.

If you replace these lines in the skin, it should work as expected. The crashing was another (non skin) related issue.

MAXIMIZED=0,0,327,414 #total region when both combined
MAXIMIZED1=0,270,327,89,0,270 #region with offset, most cases offset values will match first two parameters
MAXIMIZED2=335,33,327,324,335,33 #region with offset, most cases offset values will match first two parameters


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - eried - 03-17-2014 12:33 AM

Now with undo/redo *-* with a beautiful -but not differential- generic undoredomanager Tongue
[Image: Image%202014-03-16%20at%209.31.38%20PM.png]

(03-14-2014 03:07 PM)Tim Wessman Wrote:  MAXIMIZED=0,0,327,414 #total region when both combined
MAXIMIZED1=0,270,327,89,0,270 #region with offset, most cases offset values will match first two parameters
MAXIMIZED2=335,33,327,324,335,33 #region with offset, most cases offset values will match first two parameters

Added that info in the tiplanet wiki: http://tiplanet.org/hpwiki/index.php?title=HP_Prime/Skins#MAXIMIZED


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - abzyyy - 09-10-2015 08:09 PM

Hi Guys,

I have created some new skins today for the HP Prime Emulator. I created two; one for the prime compact and the other for the prime medium skins.

What I did was get an image of the calculator (with its nice brushed aluminium keys) from the hp website and with a little help of photoshop got some really nice looking and realistic skins.

I have uploaded them on my blog: HP PRIME EMULATOR SKINS

The images are the correct size so all you have to do is replace either the compact or medium skins (or both) in your main hp prime folder.

Hope you guys like it Smile


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - Skyblues - 09-11-2015 02:20 AM

Nice work!

I've been playing around with the skins, too, trying to increase the contrast a bit so the blue background on the keys are a bit easier to read. So far, unsuccessfully (without messing something else up).


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - abzyyy - 09-11-2015 10:05 AM

New HP Prime Skin


I have been working on a new skin for the hp prime 'small' skin.

You can download the image here: HP PRIME SMALL SKIN

This one is my best one so far. I not only replaced the brushed aluminium part, but also the buttons in the black area which was taken from the hp photo of the prime calculator. It looks sweet. I hope you guys enjoy.

All you need to to is download it, and paste it into your main hp prime emulator folder to override the existing image.


RE: PrimeSkin: HP Prime Virtual Emulator Skin Editor/Creator tool - abzyyy - 09-11-2015 10:10 AM

(09-11-2015 02:20 AM)Skyblues Wrote:  Nice work!

I've been playing around with the skins, too, trying to increase the contrast a bit so the blue background on the keys are a bit easier to read. So far, unsuccessfully (without messing something else up).

That's a good point actually. I might try work on increasing the contrast on the light blue bits!

What I would realllyy love though is to work out how to turn this into an iphone and ipad app! I would love to have this emulator on my phone! Because, sometimes I can't have my calculator with me.