Trait Component

Source

pub trait Component:
    Any
    + Send
    + Sync
    + Unpin {
    type Props<'a>: Props
       where Self: 'a;

    // Required method
    fn new(props: &Self::Props<'_>) -> Self;

    // Provided methods
    fn update(
        &mut self,
        _props: &mut Self::Props<'_>,
        _hooks: Hooks<'_, '_>,
        _updater: &mut ComponentUpdater<'_, '_>,
    ) { ... }
    fn draw(&mut self, drawer: &mut ComponentDrawer<'_, '_>) { ... }
    fn calc_children_areas(
        &self,
        children: &Components,
        layout_style: &LayoutStyle,
        drawer: &mut ComponentDrawer<'_, '_>,
    ) -> Vec<Rect> { ... }
    fn poll_change(self: Pin<&mut Self>, _cx: &mut Context<'_>) -> Poll<()> { ... }
    fn render_ref(&self, _area: Rect, _buf: &mut Buffer) { ... }
}

Expand description

组件系统核心 trait，所有自定义 UI 组件都需实现。

通过关联类型 Props 定义属性类型，支持生命周期。
new 创建组件实例。
update 响应 props/hook 变化，适合副作用、事件注册等。
draw 渲染组件内容。
calc_children_areas 默认 flex 布局计算子组件区域，可重写自定义布局。
poll_change 支持异步/响应式副作用。
render_ref 低级渲染接口，通常无需重写。

§手动实现 Component 示例

use ratatui_kit::prelude::*;
use ratatui::{style::Style, text::Line};

pub struct MyCounter;

impl Component for MyCounter {
    type Props<'a> = NoProps;
    fn new(_props: &Self::Props<'_>) -> Self {
        Self
    }
    fn update(
        &mut self,
        _props: &mut Self::Props<'_>,
        mut hooks: Hooks,
        _updater: &mut ComponentUpdater,
    ) {
        let mut state = hooks.use_state(|| 0);
        hooks.use_events(move |event| {
            // 事件处理逻辑
        });
        // ...
    }
    fn draw(&mut self, drawer: &mut ComponentDrawer<'_, '_>) {
        let area = drawer.area;
        let buf = drawer.buffer_mut();
        Line::styled(format!("Counter: {}", 42), Style::default()).render(area, buf);
    }
}