me/iced
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Draft Panes widget and panes example

Browse source
This commit is contained in:
Héctor Ramón Jiménez 2020-03-04 04:10:26 +01:00
parent 02091267bf
commit 012b4adec7
17 changed files with 801 additions and 396 deletions
Download patch file Download diff file Expand all files Collapse all files

3
examples/clock/Cargo.toml
View file

@ -5,9 +5,6 @@ authors = ["Héctor Ramón Jiménez <hector0193@gmail.com>"]
edition = "2018"
publish = false
[features]
canvas = []
[dependencies]
iced = { path = "../..", features = ["canvas", "async-std", "debug"] }
iced_native = { path = "../../native" }

4
examples/clock/README.md
View file

@ -2,7 +2,7 @@
An application that uses the `Canvas` widget to draw a clock and its hands to display the current time.
The __[`main`]__ file contains all the code of the example.
The __[`lib`]__ file contains the relevant code of the example.
<div align="center">
<img src="https://user-images.githubusercontent.com/518289/74716344-a3e6b300-522e-11ea-8aea-3cc0a5100a2e.gif">
@ -13,4 +13,4 @@ You can run it with `cargo run`:
cargo run --package clock
```
[`main`]: src/main.rs
[`lib`]: src/lib.rs

187
examples/clock/src/lib.rs Normal file
View file

@ -0,0 +1,187 @@
use iced::{
canvas, executor, Application, Canvas, Color, Command, Container, Element,
Length, Point, Subscription, Vector,
};
#[derive(Debug)]
pub struct Clock {
now: LocalTime,
clock: canvas::layer::Cache<LocalTime>,
}
#[derive(Debug, Clone, Copy)]
pub enum Message {
Tick(chrono::DateTime<chrono::Local>),
}
impl Application for Clock {
type Executor = executor::Default;
type Message = Message;
fn new() -> (Self, Command<Message>) {
(
Clock {
now: chrono::Local::now().into(),
clock: canvas::layer::Cache::new(),
},
Command::none(),
)
}
fn title(&self) -> String {
String::from("Clock - Iced")
}
fn update(&mut self, message: Message) -> Command<Message> {
match message {
Message::Tick(local_time) => {
let now = local_time.into();
if now != self.now {
self.now = now;
self.clock.clear();
}
}
}
Command::none()
}
fn subscription(&self) -> Subscription<Message> {
time::every(std::time::Duration::from_millis(500)).map(Message::Tick)
}
fn view(&mut self) -> Element<Message> {
let canvas = Canvas::new()
.width(Length::Units(400))
.height(Length::Units(400))
.push(self.clock.with(&self.now));
Container::new(canvas)
.width(Length::Fill)
.height(Length::Fill)
.center_x()
.center_y()
.into()
}
}
#[derive(Debug, PartialEq, Eq)]
struct LocalTime {
hour: u32,
minute: u32,
second: u32,
}
impl From<chrono::DateTime<chrono::Local>> for LocalTime {
fn from(date_time: chrono::DateTime<chrono::Local>) -> LocalTime {
use chrono::Timelike;
LocalTime {
hour: date_time.hour(),
minute: date_time.minute(),
second: date_time.second(),
}
}
}
impl canvas::Drawable for LocalTime {
fn draw(&self, frame: &mut canvas::Frame) {
let center = frame.center();
let radius = frame.width().min(frame.height()) / 2.0;
let offset = Vector::new(center.x, center.y);
let clock = canvas::Path::new(|path| path.circle(center, radius));
frame.fill(
&clock,
canvas::Fill::Color(Color::from_rgb8(0x12, 0x93, 0xD8)),
);
fn draw_hand(
n: u32,
total: u32,
length: f32,
offset: Vector,
path: &mut canvas::path::Builder,
) {
let turns = n as f32 / total as f32;
let t = 2.0 * std::f32::consts::PI * (turns - 0.25);
let x = length * t.cos();
let y = length * t.sin();
path.line_to(Point::new(x, y) + offset);
}
let hour_and_minute_hands = canvas::Path::new(|path| {
path.move_to(center);
draw_hand(self.hour, 12, 0.5 * radius, offset, path);
path.move_to(center);
draw_hand(self.minute, 60, 0.8 * radius, offset, path)
});
frame.stroke(
&hour_and_minute_hands,
canvas::Stroke {
width: 6.0,
color: Color::WHITE,
line_cap: canvas::LineCap::Round,
..canvas::Stroke::default()
},
);
let second_hand = canvas::Path::new(|path| {
path.move_to(center);
draw_hand(self.second, 60, 0.8 * radius, offset, path)
});
frame.stroke(
&second_hand,
canvas::Stroke {
width: 3.0,
color: Color::WHITE,
line_cap: canvas::LineCap::Round,
..canvas::Stroke::default()
},
);
}
}
mod time {
use iced::futures;
pub fn every(
duration: std::time::Duration,
) -> iced::Subscription<chrono::DateTime<chrono::Local>> {
iced::Subscription::from_recipe(Every(duration))
}
struct Every(std::time::Duration);
impl<H, I> iced_native::subscription::Recipe<H, I> for Every
where
H: std::hash::Hasher,
{
type Output = chrono::DateTime<chrono::Local>;
fn hash(&self, state: &mut H) {
use std::hash::Hash;
std::any::TypeId::of::<Self>().hash(state);
self.0.hash(state);
}
fn stream(
self: Box<Self>,
_input: futures::stream::BoxStream<'static, I>,
) -> futures::stream::BoxStream<'static, Self::Output> {
use futures::stream::StreamExt;
async_std::stream::interval(self.0)
.map(|_| chrono::Local::now())
.boxed()
}
}
}

188
examples/clock/src/main.rs
View file

@ -1,7 +1,5 @@
use iced::{
canvas, executor, Application, Canvas, Color, Command, Container, Element,
Length, Point, Settings, Subscription, Vector,
};
use clock::Clock;
use iced::{Application, Settings};
pub fn main() {
Clock::run(Settings {
@ -9,185 +7,3 @@ pub fn main() {
..Settings::default()
})
}
struct Clock {
now: LocalTime,
clock: canvas::layer::Cache<LocalTime>,
}
#[derive(Debug, Clone, Copy)]
enum Message {
Tick(chrono::DateTime<chrono::Local>),
}
impl Application for Clock {
type Executor = executor::Default;
type Message = Message;
fn new() -> (Self, Command<Message>) {
(
Clock {
now: chrono::Local::now().into(),
clock: canvas::layer::Cache::new(),
},
Command::none(),
)
}
fn title(&self) -> String {
String::from("Clock - Iced")
}
fn update(&mut self, message: Message) -> Command<Message> {
match message {
Message::Tick(local_time) => {
let now = local_time.into();
if now != self.now {
self.now = now;
self.clock.clear();
}
}
}
Command::none()
}
fn subscription(&self) -> Subscription<Message> {
time::every(std::time::Duration::from_millis(500)).map(Message::Tick)
}
fn view(&mut self) -> Element<Message> {
let canvas = Canvas::new()
.width(Length::Units(400))
.height(Length::Units(400))
.push(self.clock.with(&self.now));
Container::new(canvas)
.width(Length::Fill)
.height(Length::Fill)
.center_x()
.center_y()
.into()
}
}
#[derive(Debug, PartialEq, Eq)]
struct LocalTime {
hour: u32,
minute: u32,
second: u32,
}
impl From<chrono::DateTime<chrono::Local>> for LocalTime {
fn from(date_time: chrono::DateTime<chrono::Local>) -> LocalTime {
use chrono::Timelike;
LocalTime {
hour: date_time.hour(),
minute: date_time.minute(),
second: date_time.second(),
}
}
}
impl canvas::Drawable for LocalTime {
fn draw(&self, frame: &mut canvas::Frame) {
let center = frame.center();
let radius = frame.width().min(frame.height()) / 2.0;
let offset = Vector::new(center.x, center.y);
let clock = canvas::Path::new(|path| path.circle(center, radius));
frame.fill(
&clock,
canvas::Fill::Color(Color::from_rgb8(0x12, 0x93, 0xD8)),
);
fn draw_hand(
n: u32,
total: u32,
length: f32,
offset: Vector,
path: &mut canvas::path::Builder,
) {
let turns = n as f32 / total as f32;
let t = 2.0 * std::f32::consts::PI * (turns - 0.25);
let x = length * t.cos();
let y = length * t.sin();
path.line_to(Point::new(x, y) + offset);
}
let hour_and_minute_hands = canvas::Path::new(|path| {
path.move_to(center);
draw_hand(self.hour, 12, 0.5 * radius, offset, path);
path.move_to(center);
draw_hand(self.minute, 60, 0.8 * radius, offset, path)
});
frame.stroke(
&hour_and_minute_hands,
canvas::Stroke {
width: 6.0,
color: Color::WHITE,
line_cap: canvas::LineCap::Round,
..canvas::Stroke::default()
},
);
let second_hand = canvas::Path::new(|path| {
path.move_to(center);
draw_hand(self.second, 60, 0.8 * radius, offset, path)
});
frame.stroke(
&second_hand,
canvas::Stroke {
width: 3.0,
color: Color::WHITE,
line_cap: canvas::LineCap::Round,
..canvas::Stroke::default()
},
);
}
}
mod time {
use iced::futures;
pub fn every(
duration: std::time::Duration,
) -> iced::Subscription<chrono::DateTime<chrono::Local>> {
iced::Subscription::from_recipe(Every(duration))
}
struct Every(std::time::Duration);
impl<H, I> iced_native::subscription::Recipe<H, I> for Every
where
H: std::hash::Hasher,
{
type Output = chrono::DateTime<chrono::Local>;
fn hash(&self, state: &mut H) {
use std::hash::Hash;
std::any::TypeId::of::<Self>().hash(state);
self.0.hash(state);
}
fn stream(
self: Box<Self>,
_input: futures::stream::BoxStream<'static, I>,
) -> futures::stream::BoxStream<'static, Self::Output> {
use futures::stream::StreamExt;
async_std::stream::interval(self.0)
.map(|_| chrono::Local::now())
.boxed()
}
}
}

11
examples/panes/Cargo.toml Normal file
View file

@ -0,0 +1,11 @@
[package]
name = "panes"
version = "0.1.0"
authors = ["Héctor Ramón Jiménez <hector0193@gmail.com>"]
edition = "2018"
publish = false
[dependencies]
iced = { path = "../..", features = ["async-std"] }
clock = { path = "../clock" }
stopwatch = { path = "../stopwatch" }

18
examples/panes/README.md Normal file
View file

@ -0,0 +1,18 @@
## Counter
The classic counter example explained in the [`README`](../../README.md).
The __[`main`]__ file contains all the code of the example.
<div align="center">
<a href="https://gfycat.com/fairdeadcatbird">
<img src="https://thumbs.gfycat.com/FairDeadCatbird-small.gif">
</a>
</div>
You can run it with `cargo run`:
```
cargo run --package counter
```
[`main`]: src/main.rs

95
examples/panes/src/main.rs Normal file
View file

@ -0,0 +1,95 @@
use iced::{
panes, Application, Command, Element, Panes, Settings, Subscription,
};
use clock::{self, Clock};
use stopwatch::{self, Stopwatch};
pub fn main() {
Launcher::run(Settings {
antialiasing: true,
..Settings::default()
})
}
struct Launcher {
panes: panes::State<Example>,
}
#[derive(Debug)]
enum Example {
Clock(Clock),
Stopwatch(Stopwatch),
}
#[derive(Debug, Clone)]
enum Message {
Clock(panes::Pane, clock::Message),
Stopwatch(panes::Pane, stopwatch::Message),
}
impl Application for Launcher {
type Executor = iced::executor::Default;
type Message = Message;
fn new() -> (Self, Command<Message>) {
let (clock, _) = Clock::new();
let (panes, _) = panes::State::new(Example::Clock(clock));
dbg!(&panes);
(Self { panes }, Command::none())
}
fn title(&self) -> String {
String::from("Panes - Iced")
}
fn update(&mut self, message: Message) -> Command<Message> {
match message {
Message::Clock(pane, message) => {
if let Some(Example::Clock(clock)) = self.panes.get_mut(&pane) {
let _ = clock.update(message);
}
}
Message::Stopwatch(pane, message) => {
if let Some(Example::Stopwatch(stopwatch)) =
self.panes.get_mut(&pane)
{
let _ = stopwatch.update(message);
}
}
}
Command::none()
}
fn subscription(&self) -> Subscription<Message> {
Subscription::batch(self.panes.iter().map(|(pane, example)| {
match example {
Example::Clock(clock) => clock
.subscription()
.map(move |message| Message::Clock(pane, message)),
Example::Stopwatch(stopwatch) => stopwatch
.subscription()
.map(move |message| Message::Stopwatch(pane, message)),
}
}))
}
fn view(&mut self) -> Element<Message> {
let Self { panes } = self;
Panes::new(panes, |pane, example| match example {
Example::Clock(clock) => clock
.view()
.map(move |message| Message::Clock(pane, message)),
Example::Stopwatch(stopwatch) => stopwatch
.view()
.map(move |message| Message::Stopwatch(pane, message)),
})
.into()
}
}

204
examples/stopwatch/src/lib.rs Normal file
View file

@ -0,0 +1,204 @@
use iced::{
button, Align, Application, Button, Column, Command, Container, Element,
HorizontalAlignment, Length, Row, Subscription, Text,
};
use std::time::{Duration, Instant};
#[derive(Debug)]
pub struct Stopwatch {
duration: Duration,
state: State,
toggle: button::State,
reset: button::State,
}
#[derive(Debug)]
enum State {
Idle,
Ticking { last_tick: Instant },
}
#[derive(Debug, Clone)]
pub enum Message {
Toggle,
Reset,
Tick(Instant),
}
impl Application for Stopwatch {
type Executor = iced_futures::executor::AsyncStd;
type Message = Message;
fn new() -> (Stopwatch, Command<Message>) {
(
Stopwatch {
duration: Duration::default(),
state: State::Idle,
toggle: button::State::new(),
reset: button::State::new(),
},
Command::none(),
)
}
fn title(&self) -> String {
String::from("Stopwatch - Iced")
}
fn update(&mut self, message: Message) -> Command<Message> {
match message {
Message::Toggle => match self.state {
State::Idle => {
self.state = State::Ticking {
last_tick: Instant::now(),
};
}
State::Ticking { .. } => {
self.state = State::Idle;
}
},
Message::Tick(now) => match &mut self.state {
State::Ticking { last_tick } => {
self.duration += now - *last_tick;
*last_tick = now;
}
_ => {}
},
Message::Reset => {
self.duration = Duration::default();
}
}
Command::none()
}
fn subscription(&self) -> Subscription<Message> {
match self.state {
State::Idle => Subscription::none(),
State::Ticking { .. } => {
time::every(Duration::from_millis(10)).map(Message::Tick)
}
}
}
fn view(&mut self) -> Element<Message> {
const MINUTE: u64 = 60;
const HOUR: u64 = 60 * MINUTE;
let seconds = self.duration.as_secs();
let duration = Text::new(format!(
"{:0>2}:{:0>2}:{:0>2}.{:0>2}",
seconds / HOUR,
(seconds % HOUR) / MINUTE,
seconds % MINUTE,
self.duration.subsec_millis() / 10,
))
.size(40);
let button = |state, label, style| {
Button::new(
state,
Text::new(label)
.horizontal_alignment(HorizontalAlignment::Center),
)
.min_width(80)
.padding(10)
.style(style)
};
let toggle_button = {
let (label, color) = match self.state {
State::Idle => ("Start", style::Button::Primary),
State::Ticking { .. } => ("Stop", style::Button::Destructive),
};
button(&mut self.toggle, label, color).on_press(Message::Toggle)
};
let reset_button =
button(&mut self.reset, "Reset", style::Button::Secondary)
.on_press(Message::Reset);
let controls = Row::new()
.spacing(20)
.push(toggle_button)
.push(reset_button);
let content = Column::new()
.align_items(Align::Center)
.spacing(20)
.push(duration)
.push(controls);
Container::new(content)
.width(Length::Fill)
.height(Length::Fill)
.center_x()
.center_y()
.into()
}
}
mod time {
use iced::futures;
pub fn every(
duration: std::time::Duration,
) -> iced::Subscription<std::time::Instant> {
iced::Subscription::from_recipe(Every(duration))
}
struct Every(std::time::Duration);
impl<H, I> iced_native::subscription::Recipe<H, I> for Every
where
H: std::hash::Hasher,
{
type Output = std::time::Instant;
fn hash(&self, state: &mut H) {
use std::hash::Hash;
std::any::TypeId::of::<Self>().hash(state);
self.0.hash(state);
}
fn stream(
self: Box<Self>,
_input: futures::stream::BoxStream<'static, I>,
) -> futures::stream::BoxStream<'static, Self::Output> {
use futures::stream::StreamExt;
async_std::stream::interval(self.0)
.map(|_| std::time::Instant::now())
.boxed()
}
}
}
mod style {
use iced::{button, Background, Color, Vector};
pub enum Button {
Primary,
Secondary,
Destructive,
}
impl button::StyleSheet for Button {
fn active(&self) -> button::Style {
button::Style {
background: Some(Background::Color(match self {
Button::Primary => Color::from_rgb(0.11, 0.42, 0.87),
Button::Secondary => Color::from_rgb(0.5, 0.5, 0.5),
Button::Destructive => Color::from_rgb(0.8, 0.2, 0.2),
})),
border_radius: 12,
shadow_offset: Vector::new(1.0, 1.0),
text_color: Color::WHITE,
..button::Style::default()
}
}
}
}

204
examples/stopwatch/src/main.rs
View file

@ -1,206 +1,6 @@
use iced::{
button, Align, Application, Button, Column, Command, Container, Element,
HorizontalAlignment, Length, Row, Settings, Subscription, Text,
};
use std::time::{Duration, Instant};
use iced::{Application, Settings};
use stopwatch::Stopwatch;
pub fn main() {
Stopwatch::run(Settings::default())
}
struct Stopwatch {
duration: Duration,
state: State,
toggle: button::State,
reset: button::State,
}
enum State {
Idle,
Ticking { last_tick: Instant },
}
#[derive(Debug, Clone)]
enum Message {
Toggle,
Reset,
Tick(Instant),
}
impl Application for Stopwatch {
type Executor = iced_futures::executor::AsyncStd;
type Message = Message;
fn new() -> (Stopwatch, Command<Message>) {
(
Stopwatch {
duration: Duration::default(),
state: State::Idle,
toggle: button::State::new(),
reset: button::State::new(),
},
Command::none(),
)
}
fn title(&self) -> String {
String::from("Stopwatch - Iced")
}
fn update(&mut self, message: Message) -> Command<Message> {
match message {
Message::Toggle => match self.state {
State::Idle => {
self.state = State::Ticking {
last_tick: Instant::now(),
};
}
State::Ticking { .. } => {
self.state = State::Idle;
}
},
Message::Tick(now) => match &mut self.state {
State::Ticking { last_tick } => {
self.duration += now - *last_tick;
*last_tick = now;
}
_ => {}
},
Message::Reset => {
self.duration = Duration::default();
}
}
Command::none()
}
fn subscription(&self) -> Subscription<Message> {
match self.state {
State::Idle => Subscription::none(),
State::Ticking { .. } => {
time::every(Duration::from_millis(10)).map(Message::Tick)
}
}
}
fn view(&mut self) -> Element<Message> {
const MINUTE: u64 = 60;
const HOUR: u64 = 60 * MINUTE;
let seconds = self.duration.as_secs();
let duration = Text::new(format!(
"{:0>2}:{:0>2}:{:0>2}.{:0>2}",
seconds / HOUR,
(seconds % HOUR) / MINUTE,
seconds % MINUTE,
self.duration.subsec_millis() / 10,
))
.size(40);
let button = |state, label, style| {
Button::new(
state,
Text::new(label)
.horizontal_alignment(HorizontalAlignment::Center),
)
.min_width(80)
.padding(10)
.style(style)
};
let toggle_button = {
let (label, color) = match self.state {
State::Idle => ("Start", style::Button::Primary),
State::Ticking { .. } => ("Stop", style::Button::Destructive),
};
button(&mut self.toggle, label, color).on_press(Message::Toggle)
};
let reset_button =
button(&mut self.reset, "Reset", style::Button::Secondary)
.on_press(Message::Reset);
let controls = Row::new()
.spacing(20)
.push(toggle_button)
.push(reset_button);
let content = Column::new()
.align_items(Align::Center)
.spacing(20)
.push(duration)
.push(controls);
Container::new(content)
.width(Length::Fill)
.height(Length::Fill)
.center_x()
.center_y()
.into()
}
}
mod time {
use iced::futures;
pub fn every(
duration: std::time::Duration,
) -> iced::Subscription<std::time::Instant> {
iced::Subscription::from_recipe(Every(duration))
}
struct Every(std::time::Duration);
impl<H, I> iced_native::subscription::Recipe<H, I> for Every
where
H: std::hash::Hasher,
{
type Output = std::time::Instant;
fn hash(&self, state: &mut H) {
use std::hash::Hash;
std::any::TypeId::of::<Self>().hash(state);
self.0.hash(state);
}
fn stream(
self: Box<Self>,
_input: futures::stream::BoxStream<'static, I>,
) -> futures::stream::BoxStream<'static, Self::Output> {
use futures::stream::StreamExt;
async_std::stream::interval(self.0)
.map(|_| std::time::Instant::now())
.boxed()
}
}
}
mod style {
use iced::{button, Background, Color, Vector};
pub enum Button {
Primary,
Secondary,
Destructive,
}
impl button::StyleSheet for Button {
fn active(&self) -> button::Style {
button::Style {
background: Some(Background::Color(match self {
Button::Primary => Color::from_rgb(0.11, 0.42, 0.87),
Button::Secondary => Color::from_rgb(0.5, 0.5, 0.5),
Button::Destructive => Color::from_rgb(0.8, 0.2, 0.2),
})),
border_radius: 12,
shadow_offset: Vector::new(1.0, 1.0),
text_color: Color::WHITE,
..button::Style::default()
}
}
}
}