Let's see your GUI!

Cahin

Here is the UI that I am currently using.  I used to have a window for outputting demon trace in the upper right hand corner but I am no longer apostate.  Now I usually put video streaming windows up in that corner.

Tharvis

@Zulah, any chance for a small tutorial on how to make the mudlet mapper get replaced by a seafaring map window when boarding a ship and vica versa when disembarking?

Eld

Tharvis said:

@Zulah, any chance for a small tutorial on how to make the mudlet mapper get replaced by a seafaring map window when boarding a ship and vica versa when disembarking?

I posted a script a while back that does this for the wilderness map in general. Uses a small map window (in the right corner by default, but with the size and location adjustable) and swaps it out with a capture of the wilderness map when you enter the wilderness or a ship, and vice versa. I'll see if I can scare up the link.

Edit:

This should be the current version.

https://docs.google.com/uc?export=download&id=0Bxhnkqe60WzXZkJJZV8wT2JMSTg

Screenshot with area map

[spoiler][/spoiler]

Screenshot with wilderness map

[spoiler][/spoiler]

Zulah

Tharvis said:

@Zulah, any chance for a small tutorial on how to make the mudlet mapper get replaced by a seafaring map window when boarding a ship and vica versa when disembarking?

If you're using the geyser seamap I showed in the other post you can easily tell it to show or not show with:
hideWindow("seamapper")
showWindow("seamapper")

Then if your mudlet mapper is also in a geyser label window you can do the same calling that by its name, for example if it's name is "walkingmapper"
hideWindow("walkingmapper")

I personally have a button made I can use to toggle which I'm using:



These look best on a nice grey background as seen in my GUI, I use (40,43,43) color code for my BG

Here is some example code to use them as a switch/button:
This is the script to create the image of the button on the screen with a function called: mapToggle()
mapToggle() will activate each time you press the button with setLabelClickCallback() function
[spoiler]
map_selector = Geyser.Label:new({

name = "map_selector",

x =10, y = 10,

width = 130, height = 75,

})

setBackgroundColor("map_selector",0,0,0,0);

setBackgroundImage("map_selector","c:/mudlet/sharpGFX/squareToggleLand.png") -- Change this to where you saved the images on your hard drive.

setLabelClickCallback("map_selector", "mapToggle()" )

[/spoiler]

Here is the mapToggle() function
[spoiler]
function mapToggle()

if mapOn == 1

then

setSeaMap()

setBackgroundImage("map_selector","c:/mudlet/sharpGFX/squareToggleSea.png");

hideWindow("walkingmapper")

showWindow("seamapper")

mapOn = 0

else

setBackgroundImage("map_selector","c:/mudlet/sharpGFX/squareToggleLand.png");

hideWindow("seamapper")

showWindow("walkingmapper")

mapOn = 1

end

end

[/spoiler]

I have a variable called: mapOn
It tracks which map mode I'm using to toggle back and forth easily.
My mudlet mapper window is obviously called "walkingmapper"
and the setBackgroundImage is just to change the toggle button to reflect which mode you are in.

Antonius

People using 1 and 0 to track boolean conditions annoys me more than it probably should. You're using a real language now, people, start using actual boolean variables!

Iocun

I'll start using the strings "that's true" and "that's totally not true!" for my boolean variables from now on, just to piss off @Antonius.

Zulah

Iocun said:

I'll start using the strings "that's true" and "that's totally not true!" for my boolean variables from now on, just to piss off @Antonius.

I now feel the need to use "fo sho" and "oh no you didn't"

Jonathin

I used gmcp info to switch between the maps.

gmcp.Room.Info.environment = "Vessel" for ships. So just make a function that fires off gmcp like

function mapswap()

  if gmcp.Room.Info.environment == "Vessel" then

    mapper:hide()

    seamapper:show()

  else

    mapper:show()

    seamapper:hide()

  end

end

Swaps when you get onto a ship and swaps back when you disembark.

Zulah

@Jonathin thats much smoother thanks. Frees up real estate I don't have to use on a toggle switch too!

Shadizar

Screenshot with wilderness map

The map looks great and all but it's that limb counter I really like. @Vadimuses if there were an option for a console like that instead of or combined with the kl_prompttag it would be yet another reason to love the greatness of svo.

Tharvis

Eld said:

Tharvis said:

@Zulah, any chance for a small tutorial on how to make the mudlet mapper get replaced by a seafaring map window when boarding a ship and vica versa when disembarking?

I posted a script a while back that does this for the wilderness map in general. Uses a small map window (in the right corner by default, but with the size and location adjustable) and swaps it out with a capture of the wilderness map when you enter the wilderness or a ship, and vice versa. I'll see if I can scare up the link.

Edit:

This should be the current version.

https://docs.google.com/uc?export=download&id=0Bxhnkqe60WzXZkJJZV8wT2JMSTg

Screenshot with area map

[spoiler][/spoiler]

Screenshot with wilderness map

[spoiler][/spoiler]

thanks! Now just to figure out where in the script to change the coordinates

Eld

Tharvis said:

Eld said:

Tharvis said:

@Zulah, any chance for a small tutorial on how to make the mudlet mapper get replaced by a seafaring map window when boarding a ship and vica versa when disembarking?

I posted a script a while back that does this for the wilderness map in general. Uses a small map window (in the right corner by default, but with the size and location adjustable) and swaps it out with a capture of the wilderness map when you enter the wilderness or a ship, and vice versa. I'll see if I can scare up the link.

Edit:

This should be the current version.

https://docs.google.com/uc?export=download&id=0Bxhnkqe60WzXZkJJZV8wT2JMSTg

Screenshot with area map

[spoiler][/spoiler]

Screenshot with wilderness map

[spoiler][/spoiler]

thanks! Now just to figure out where in the script to change the coordinates

Yeah, that could be documented better....

You want to look in the script titled GUI (a folder, I think) and set the values in pv.gui.config.map.dim

Keneanung

Shadizar said:

The map looks great and all but it's that limb counter I really like. @Vadimuses if there were an option for a console like that instead of or combined with the kl_prompttag it would be yet another reason to love the greatness of svo.

The limbcounter exposes all data via a table, which can be used to create such a console. Look at the documentation at doc.svo.vadisystems.com. The monk list would be svo.ml_list. There are even event to notify you of changes.

Shadizar

Keneanung said:

The map looks great and all but it's that limb counter I really like. @Vadimuses if there were an option for a console like that instead of or combined with the kl_prompttag it would be yet another reason to love the greatness of svo.

The limbcounter exposes all data via a table, which can be used to create such a console. Look at the documentation at doc.svo.vadisystems.com. The monk list would be svo.ml_list. There are even event to notify you of changes.

Yeah, if I knew how to do that I'd also right away take the info from @affs and display on a small console as well. I just haven't yet made that breakthrough with fully understanding tables. Self teaching yourself coding feels like staring at hieroglyphics until they suddenly make sense.

Tharvis

Eld said:

Tharvis said:

Eld said:

Tharvis said:

@Zulah, any chance for a small tutorial on how to make the mudlet mapper get replaced by a seafaring map window when boarding a ship and vica versa when disembarking?

I posted a script a while back that does this for the wilderness map in general. Uses a small map window (in the right corner by default, but with the size and location adjustable) and swaps it out with a capture of the wilderness map when you enter the wilderness or a ship, and vice versa. I'll see if I can scare up the link.

Edit:

This should be the current version.

https://docs.google.com/uc?export=download&id=0Bxhnkqe60WzXZkJJZV8wT2JMSTg

Screenshot with area map

[spoiler][/spoiler]

Screenshot with wilderness map

[spoiler][/spoiler]

thanks! Now just to figure out where in the script to change the coordinates

Yeah, that could be documented better....

You want to look in the script titled GUI (a folder, I think) and set the values in pv.gui.config.map.dim

right, done that, I can change where the mapper shows itself, and can alter the width and height of the normal mapper, but the wilderness map I can't seem to change the size, widths and heights I put don't seem to influence it

Eld

Tharvis said:

Eld said:

Tharvis said:

Eld said:

Tharvis said:

@Zulah, any chance for a small tutorial on how to make the mudlet mapper get replaced by a seafaring map window when boarding a ship and vica versa when disembarking?

I posted a script a while back that does this for the wilderness map in general. Uses a small map window (in the right corner by default, but with the size and location adjustable) and swaps it out with a capture of the wilderness map when you enter the wilderness or a ship, and vice versa. I'll see if I can scare up the link.

Edit:

This should be the current version.

https://docs.google.com/uc?export=download&id=0Bxhnkqe60WzXZkJJZV8wT2JMSTg

Screenshot with area map

[spoiler][/spoiler]

Screenshot with wilderness map

[spoiler][/spoiler]

thanks! Now just to figure out where in the script to change the coordinates

Yeah, that could be documented better....

You want to look in the script titled GUI (a folder, I think) and set the values in pv.gui.config.map.dim

right, done that, I can change where the mapper shows itself, and can alter the width and height of the normal mapper, but the wilderness map I can't seem to change the size, widths and heights I put don't seem to influence it

Oh, yeah, that's true, I hadn't considered that you might want a window smaller (or larger) than the wilderness map itself. Since it just copy/pastes it from the normal game output, to change the size, you'd need to adjust the font size used to display it. It'll be a fairly coarse adjustment, since you can only do integer font sizes, but you can use pv.gui.map.wilderness:setFontSize(size) and play around until you find one you like. I could probably put something in to use calcFontSize to figure out a reasonable size based on the size of the container, but it'd be a bit tricky to come up with something general-purpose, given how much the size of the wilderness map can change.

Tharvis

meh, as long as it shows the sea map when I need it, and I can atleast vaguely recognise chops, it's fine

thanks for the help!

Zulah

Quick ship window update. Added a speedometer. It starts top middle and goes around 1 tick of the the 16 point compass for 1 nautical mile. So a full blue circle would be 16 knots. On the right heading into the wind I'm going 6knots, on the left you can see I've passed 16 knots into the red zone at 19 knots. You're sails take more damage at that speed hence the "red zone" and you can see I had some good winds to push it that hard. So far I've gotten it this test up to 24 knots.

Vastus

Shadizar said:

Keneanung said:

The map looks great and all but it's that limb counter I really like. @Vadimuses if there were an option for a console like that instead of or combined with the kl_prompttag it would be yet another reason to love the greatness of svo.

The limbcounter exposes all data via a table, which can be used to create such a console. Look at the documentation at doc.svo.vadisystems.com. The monk list would be svo.ml_list. There are even event to notify you of changes.

Yeah, if I knew how to do that I'd also right away take the info from @affs and display on a small console as well. I just haven't yet made that breakthrough with fully understanding tables. Self teaching yourself coding feels like staring at hieroglyphics until they suddenly make sense.

If you go to svo and then examples, there is the code for an affliction window, you just need to remove one line and change the coordinates and size (and color if you want) to your liking. Service of Vadi, with credit going to Iocun.

Trevize

I've posted it in the other thread, but eh.

Mine: http://s12.postimg.org/6hfz181b1/gui.png

Pastebin: http://pastebin.com/raw.php?i=0GU5bMBj

It may look complicated, but it's built to be dynamic. Read the comments, what you need to do to get it running is simple - there's comments with the script to send the current health/mana/etc to bars, and info to chat windows. Doesn't have to be chat - hell, I used to use one to send combat stuff to.

Got a lot of work to do on it, but I'll get around to it... eventually.

Vastus

Because of this thread I wanted to make a GUI too and here it is, most of it is just copied and changing the coordinates and size. This is something you can do without any coding knowledge (still can't code, heh). The empty window at the top is an affliction tracker, but I wasn't afflicted with anything so it is empty. Besides that I got all I need: chat window, mapper, room inventory, said affliction tracker and a nice picture. Still looking for one that looks like Vastus, but this will be a placeholder until then. It is a bit messy, but I still like it.

Vadimuses

Zulah said:

Quick ship window update. Added a speedometer. It starts top middle and goes around 1 tick of the the 16 point compass for 1 nautical mile. So a full blue circle would be 16 knots. On the right heading into the wind I'm going 6knots, on the left you can see I've passed 16 knots into the red zone at 19 knots. You're sails take more damage at that speed hence the "red zone" and you can see I had some good winds to push it that hard. So far I've gotten it this test up to 24 knots.

That is really smooth. I'd like to put it up on mudlet.org/media when you're done.

Zulah

@Vadimuses Absolutely! Feel free to share it wherever. I linked the basic finished one already. But I'm working on another version fixing all the little things people have msg'd me about. Got quite a bit of constructive feedback that I think will help it work more universally for people. Should have an update out this week with the suggestions in.

Jonathin

I shamelessly stole @Zulah's color scheme because I liked it, but this is what I'm working on right now.

Zulah

Jonathin said:

I shamelessly stole @Zulah's color scheme because I liked it, but this is what I'm working on right now.

No shame in that I like the clean black/grey style.

If you really want here is a PSD File of all the assets I've used so far. Square toggles : Red Green Buttons : Background layers : small green light toggles : Target windows

You'll need photoshop but all the layers are organized and labeled so you can easily change the text or style on buttons and other elements

Jonathin

mm mm good. Thanks!

Daslin

God.. All you people and your seafaring crap. I like mine, fairly friggin' simple.

Zulah

Best way I think to make GUI's in mudlet is treat it like designing a web page. Do all your preliminary work in photoshop or editor of your choice. Layers you can manipulate. Then splice and break down the layers into the sections you want to use. Save to PNG (low file size and mudlet importable with transparent backgrounds available)
Import the layout to mudlet and instant professional looking GUI's.

This was a right side concept I was working on for my mudlet but I decided against. I'm still using the visual limb tracking part of it though just because I like the way it looks. Yellow for me means next hit will break the limb and turn it red.




And the PSD assets including the rest of the right side features I steered away from.

PSD Right Side Background

Check it out for some helpful layout ideas if you want

Jonathin

 Thanks for sharing!

Shibumi

Really beautiful. Congrats, to everybody. I wish one day I will be able to do so! The limbcounter is simply amazing.