GUI for Rust

You can finde a demo here and the code here.

Little an simple gui library for Rust inspired by react. gui and uses nanovg as default backend library for rendering. More information can be found in the docs.

Everything should be abstracted into the widget api including all drawing-operations. This allows to switch the backend without changing the api. Aditionaly it simplifyes the usage of the api because there are only some widgets you should know about and not more.

build

it should normaly compile with cargo build if not follow the instructions for nanovg which could be the reason why failed.

Ideas

random thoughts not jet implemented

animation

idea with animation

let animated = Animation::new(component, |c, x|{
	c.x = x;
	c.y = y;
}, Linear);

c.add(1, animated);

this means to just use a wrapper component which takes the component which should be animated and manages the state of the animation. on every tick event it calls the clusure modifying the component with the current paramer.

styling

The context handles the style if a element is not styled the values returned from style are the default values. If there is something specified, this style will be applied to the component if not overridden. This way each component can be easily styled. Later in the process I might develop a small css like style language to make styling applications as easy as styling html.

let b = Button{
	..c.style("agree")
};
c.add(1, b);

Macros

this is not jet implemented and might change

pattern	description
`[...]`	container for child nodes
`{...}`	indicates some code for this context
`	$event:ident
`$name:ident(...)`	a new widget

data!(
	Group[
		Path("M12,54L4,4L34,100"),
		Button(text="Hallo")|event|{
			//handle the events here
			//
		}//==Button("Hallo")
	]
);
widget! Button(
	(
		text: &str = "",
		icon: Option<Icon> = None,
	){
		Path(...)
	}
);

Button{
	x: 10
	y: 100
	text: "test"

	Name{
		x: 100
		y: 10
		text: "wer auch immer"
	}
}

TODO:

Screenshots

Links

ctx.add(1, |default| animation(Mode::Linear, 0..100, |x| Button{ width: x ,..default })

pub enum TimingFunction{
	Linear,
	Ease,
	EaseIn,
	EaseOut,
	EaseInOut,
	StepStart,
	StepEnd
}

All styles and some other configuration is provided by dependency injecten. This is implemented with a map that contains the TypeId as key and a value as Rc. The components can get the value by calling ctx.get(). This way config parameters can be passed. you can also config this context for child nodes by calling the appropriet setter.

enex/rust_gui