- UI, ingame + menu about punchy HOT 16 CLOSED

Just players, yep. The Castle Crashers reference up top is very fitting.

Enemies don’t need any health bars. Maybe later we will occasionally show them when dealing critical dmg and that sort of thing.

from punchy.

Those were my only concerns about egui so if you already know how to do ninepatch with it id say go for it.

from punchy.

Yep, I can take it. I enjoy writing nice UIs. :)

I'll start working on that, I just want to get basic character hot-reloading working first so that I don't have to come back to it later. ( It should take less than an hour )

from punchy.

I'll start working on that, I just want to get basic character hot-reloading working first so that I don't have to come back to it later. ( It should take less than an hour )

no pressure on when to start just making sure my assumption on this were in line with yours so I can prioritize 👍

Oh, do we have any UI skin assets yet? Should I just copy them from FishFight?

We definitely don't have anything specific to punchy UI skin wise, last I heard they hadn't gotten to skinning egui yet in FishFight either but I could be wrong on that.

from punchy.

Yep, just copy from fishfight. If you have other requirements you can use any free thing in itch.io, as that’s all we’re using in fishfight for now anyway.

from punchy.

Still a little bit of work to do, but I've got a lot of the UI system fleshed out!

It's totally themeable with YAML resources, including hot reload.

from punchy.

I've got the start to in-game HUD. Just need to get life-bars implemented now:

from punchy.

Looking good!

from punchy.

Now we just need a way to hurt the player so we can see the lifebar move. :)

basic enemy ai and attacks are in, healthbar works as expected

from punchy.

Hey there! This is something I could work on. I've been doing some work with Bevy and Egui recently:

I've found egui really nice to use.

Floating health bars + player/character portraits, likely made using bevy's native UI features.

Is there a reason we wouldn't use Egui for those as well, so that we don't have to worry about understanding and using two different UI systems?

Also, what kind of skin are you thinking for the UI? Would we borrow from the FishFight UI theme?

from punchy.

Is there a reason we wouldn't use Egui for those as well, so that we don't have to worry about understanding and using two different UI systems?

It seems to me that the HUD will require ninepatch + image backgrounds as well as absolute screen positioning. It seemed like it might be simpler to have the HUD in bevy native ui. HUD and menus dont have to interact at all so I was hoping it wouldnt be an issue.

I did however see someone patch egui to support ninepatch rendering the other day though so thats something to consider. https://discord.com/channels/691052431525675048/885021580353237032/989112997458874390
https://github.com/freiksenet/lands_of_mana/tree/main/src/gui/widgets relevant sections being window.rs and nine_patch.rs

Also, what kind of skin are you thinking for the UI? Would we borrow from the FishFight UI theme?

I think that is the idea for the egui side but afaik the theming has not actually been done in FishFight yet.

The menu in above looks really good btw! How did you go about theming it?

from punchy.

I've got 9-patch versions of Egui frames and buttons working as shown in the screenshot above, so that shouldn't be an issue. And absolute positioning is simple, too.

The ninepatch frame of mine cost about 300 lines of code ( see here ), it's just a simple modification of the built-in egui frame code. Buttons are a similar story.

And using it super simple:

BorderedFrame::new(&ui_theme.panel_bg)
.margin(outer_margin)
.padding(Rect::all(8.0))
.show(ui, |ui| {
    // Make sure the frame ocupies the entire rect that we allocated for it.
    //
    // Without this it would only take up enough size to fit it's content.
    ui.set_min_size(ui.available_size());


    // Create a vertical list of items, centered horizontally
    ui.vertical_centered(|ui| {
        ui.retro_label("Bevy Retro + Egui = ♥", &ui_theme.font);


        ui.add_space(10.0);
        RetroLabel::new("Click a button to scale the background", &ui_theme.font)
            .color(egui::Color32::GREEN)
            .show(ui);


        // Now switch the layout to bottom_up so that we can start adding widgets
        // from the bottom of the frame.
        ui.with_layout(egui::Layout::bottom_up(egui::Align::Center), |ui| {
            ui.add_space(4.0);


            if RetroButton::new("Scale Down", &ui_theme.font)
                .padding(Rect::all(7.0))
                .border(&ui_theme.button_up_bg)
                .on_click_border(&ui_theme.button_down_bg)
                .show(ui)
                .clicked()
            {
                map_transform.scale -= Vec3::splat(0.2);
            }


            if RetroButton::new("Scale Up", &ui_theme.font)
                .padding(Rect::all(7.0))
                .border(&ui_theme.button_up_bg)
                .on_click_border(&ui_theme.button_down_bg)
                .show(ui)
                .clicked()
            {
                map_transform.scale += Vec3::splat(0.2);
            }
        });
    });
})

But I'm good using whatever you want to, just let me know. 👍

from punchy.

@zicklag do you want to be assigned this as well? I am interested in learning egui but im sure there will be plenty of opportunity and I personally would appreciate the benefit of your experience here.

from punchy.

Oh, do we have any UI skin assets yet? Should I just copy them from FishFight?

from punchy.

About the in-game UI, who gets a portrait and health bar at the top of the screen? Just the players, and not the enemies right?

Is there any sort of life display for enemies. Like a thin, floating life bar above their head or something like that?

from punchy.

Lifebars are working! #50

Now we just need a way to hurt the player so we can see the lifebar move. :)

from punchy.