image_background.rs

use bevy::prelude::*;
use bevy_cosmic_edit::*;

fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
    commands.spawn(Camera2dBundle::default());

    let bg_image_handle = asset_server.load("img/bevy_logo_light.png");

    let editor = commands
        .spawn(CosmicEditBundle {
            attrs: CosmicAttrs(AttrsOwned::new(
                Attrs::new().color(bevy_color_to_cosmic(Color::GREEN)),
            )),
            background_image: CosmicBackground(Some(bg_image_handle)),
            ..default()
        })
        .insert(CosmicEditUiBundle {
            node_bundle: NodeBundle {
                style: Style {
                    // Size and position of text box
                    width: Val::Px(300.),
                    height: Val::Px(50.),
                    left: Val::Px(100.),
                    top: Val::Px(100.),
                    ..default()
                },
                background_color: Color::WHITE.into(),
                ..default()
            },
            ..default()
        })
        .id();
    commands.insert_resource(Focus(Some(editor)));
}

pub fn bevy_color_to_cosmic(color: bevy::prelude::Color) -> CosmicColor {
    cosmic_text::Color::rgba(
        (color.r() * 255.) as u8,
        (color.g() * 255.) as u8,
        (color.b() * 255.) as u8,
        (color.a() * 255.) as u8,
    )
}

fn main() {
    App::new()
        .add_plugins(DefaultPlugins)
        .add_plugins(CosmicEditPlugin::default())
        .add_systems(Startup, setup)
        .run();
}