Calculator App in Rust egui — Grid Layout & Operator Logic | Learn egui Ep28
21views
1likes
014:16
T
Taught by Celeste AI - AI Coding Coach
View on YouTubeDescription
Build a fully functional calculator app in Rust using egui! In this episode, we create a calculator with a dark display
panel, color-coded button grid (orange operators, gray numbers), and an operator state machine that handles chained
arithmetic, decimals, percentage, negate, and division-by-zero errors.
Student code: https://github.com/GoCelesteAI/egui_calculator
What You'll Learn:
- TopBottomPanel for a fixed calculator display
- Button::new().fill() for custom button colors with Color32
- Horizontal layout with add_sized for consistent button grids
- Operator state machine pattern (first, operator, reset_next)
- String to f64 parsing for arithmetic
- Wide zero button spanning two columns
- Division by zero error handling
- RichText with monospace font for the display
- Frame with fill and corner_radius for styled panels
- Layout::right_to_left for right-aligned display text
- Neo-tree file browsing in a Rust project
This is Episode 28 of the "Learn egui in Neovim" series — 36 episodes teaching Rust GUI development with egui, all coded in
Neovim with Neo-tree.
Chapters:
0:00 Intro
0:12 What We're Building
0:22 Preview: Key Concepts
0:54 Create Project & Dependencies
1:30 main.rs — Window Setup
2:30 app.rs — MyApp Struct
3:30 Default Implementation
4:30 press_digit Helper
5:30 press_operator Helper
6:00 evaluate — Arithmetic Logic
8:00 clear Helper
8:30 Review Helper Methods
9:00 eframe::App — Display Panel
10:00 Central Panel — Button Grid
10:30 Row Definitions
11:00 Button Styling (Orange/Gray)
12:00 Wide Zero Button
12:30 Click Handler — Match Label
14:00 Save & Review Code
15:00 cargo build
15:30 Neo-tree Browse
16:00 App Demo
17:00 Recap
17:40 Next Episode
Tags: rust, egui, calculator, gui, tutorial, neovim, neo-tree, eframe, button, grid, state machine, color32, richtext,
layout, panel, topbottompanel, add_sized, fill, parse, f64, operator, arithmetic, coding, programming, learn rust, rust
gui, desktop app
Hashtags: #rust #egui #calculator #gui #neovim #rustlang #coding #tutorial
Tags
rusteguicalculatorguitutorialneovimneo-treeeframebuttongridstate machinecolor32richtextlayoutpanel