grid_layout_demo_v2/
grid_layout_demo_v2.rs

1// GridLayout 网格布局演示 - 使用新库 API
2// 展示如何使用 GridLayout 创建网格排列
3// 运行: cargo run --example grid_layout_demo_v2 --release
4
5use termux_gui::{Activity, Result};
6use termux_gui::connection::read_message;
7
8fn main() -> Result<()> {
9    println!("=== GridLayout 网格布局演示 (新库版本) ===\n");
10    
11    // 创建 Activity(全屏模式)
12    let mut activity = Activity::new(false)?;
13    println!("✓ 连接建立\n");
14    
15    // 创建 NestedScrollView 作为根布局(支持滚动)
16    let scroll = activity.create_nested_scroll_view(None)?;
17    
18    // 创建主布局(放在 ScrollView 内)
19    let layout = activity.create_linear_layout(Some(scroll.id()))?;
20    layout.view().set_margin(&mut activity, 15)?;
21    
22    // 创建标题
23    let title = activity.create_text_view("🎯 GridLayout 演示", Some(layout.id()))?;
24    title.set_text_size(&mut activity, 26)?;
25    title.view().set_margin(&mut activity, 10)?;
26    title.view().set_height_wrap_content(&mut activity)?;
27    title.view().set_linear_layout_params(&mut activity, 0, None)?;
28    
29    // 创建说明
30    let desc = activity.create_text_view("网格布局:行列自动排列", Some(layout.id()))?;
31    desc.view().set_margin(&mut activity, 5)?;
32    desc.view().set_height_wrap_content(&mut activity)?;
33    desc.view().set_linear_layout_params(&mut activity, 0, None)?;
34    
35    // ========== 示例1: 3x3 按钮网格 ==========
36    let section1 = activity.create_text_view("示例1: 3×3 按钮网格", Some(layout.id()))?;
37    section1.set_text_size(&mut activity, 18)?;
38    section1.view().set_margin(&mut activity, 10)?;
39    section1.view().set_height_wrap_content(&mut activity)?;
40    section1.view().set_linear_layout_params(&mut activity, 0, None)?;
41    section1.set_text_color(&mut activity, 0xFF2196F3u32 as i32)?;
42    
43    // 创建 3x3 GridLayout
44    let grid1 = activity.create_grid_layout(3, 3, Some(layout.id()))?;
45    grid1.view().set_margin(&mut activity, 10)?;
46    grid1.view().set_width_match_parent(&mut activity)?;
47    grid1.view().set_height_wrap_content(&mut activity)?;
48    grid1.view().set_linear_layout_params(&mut activity, 0, None)?;
49    
50    // 创建9个按钮(自动填充到3x3网格)
51    let mut grid1_buttons = Vec::new();
52    for i in 1..=9 {
53        let btn = activity.create_button(&format!("{}", i), Some(grid1.id()))?;
54        grid1_buttons.push(btn);
55    }
56    
57    // ========== 示例2: 2x4 文本网格 ==========
58    let divider1 = activity.create_text_view("━━━━━━━━━━━━━━━━━━━━", Some(layout.id()))?;
59    divider1.view().set_margin(&mut activity, 10)?;
60    divider1.view().set_height_wrap_content(&mut activity)?;
61    divider1.view().set_linear_layout_params(&mut activity, 0, None)?;
62    
63    let section2 = activity.create_text_view("示例2: 2×4 表情网格", Some(layout.id()))?;
64    section2.set_text_size(&mut activity, 18)?;
65    section2.view().set_margin(&mut activity, 10)?;
66    section2.view().set_height_wrap_content(&mut activity)?;
67    section2.view().set_linear_layout_params(&mut activity, 0, None)?;
68    section2.set_text_color(&mut activity, 0xFF4CAF50u32 as i32)?;
69    
70    // 创建 2x4 GridLayout
71    let grid2 = activity.create_grid_layout(2, 4, Some(layout.id()))?;
72    grid2.view().set_margin(&mut activity, 10)?;
73    grid2.view().set_width_match_parent(&mut activity)?;
74    grid2.view().set_height_wrap_content(&mut activity)?;
75    grid2.view().set_linear_layout_params(&mut activity, 0, None)?;
76    
77    // 8个表情文本(自动填充到2x4网格)
78    let emojis = ["😀", "😎", "🎉", "🚀", "🌟", "❤️", "👍", "🔥"];
79    for emoji in &emojis {
80        let text = activity.create_text_view(emoji, Some(grid2.id()))?;
81        text.set_text_size(&mut activity, 32)?;
82        text.view().set_margin(&mut activity, 5)?;
83    }
84    
85    // ========== 示例3: 4x2 混合网格 ==========
86    let divider2 = activity.create_text_view("━━━━━━━━━━━━━━━━━━━━", Some(layout.id()))?;
87    divider2.view().set_margin(&mut activity, 10)?;
88    divider2.view().set_height_wrap_content(&mut activity)?;
89    divider2.view().set_linear_layout_params(&mut activity, 0, None)?;
90    
91    let section3 = activity.create_text_view("示例3: 4×2 开关网格", Some(layout.id()))?;
92    section3.set_text_size(&mut activity, 18)?;
93    section3.view().set_margin(&mut activity, 10)?;
94    section3.view().set_height_wrap_content(&mut activity)?;
95    section3.view().set_linear_layout_params(&mut activity, 0, None)?;
96    section3.set_text_color(&mut activity, 0xFFFF9800u32 as i32)?;
97    
98    // 创建 4x2 GridLayout
99    let grid3 = activity.create_grid_layout(4, 2, Some(layout.id()))?;
100    grid3.view().set_margin(&mut activity, 10)?;
101    grid3.view().set_width_match_parent(&mut activity)?;
102    grid3.view().set_height_wrap_content(&mut activity)?;
103    grid3.view().set_linear_layout_params(&mut activity, 0, None)?;
104    
105    // 8个 ToggleButton(自动填充到4x2网格)
106    let toggle_labels = ["WiFi", "蓝牙", "GPS", "飞行", "数据", "热点", "蓝光", "省电"];
107    let mut grid3_toggles = Vec::new();
108    for label in &toggle_labels {
109        let toggle = activity.create_toggle_button(label, Some(grid3.id()))?;
110        grid3_toggles.push(toggle);
111    }
112    
113    // ========== 底部信息 ==========
114    let divider3 = activity.create_text_view("━━━━━━━━━━━━━━━━━━━━", Some(layout.id()))?;
115    divider3.view().set_margin(&mut activity, 10)?;
116    divider3.view().set_height_wrap_content(&mut activity)?;
117    divider3.view().set_linear_layout_params(&mut activity, 0, None)?;
118    
119    let info = activity.create_text_view(
120        "💡 GridLayout 特点:\n\
121        • 指定行数和列数创建网格\n\
122        • 子视图按添加顺序自动填充\n\
123        • 从左到右、从上到下排列\n\
124        • 适合创建规则的网格界面",
125        Some(layout.id())
126    )?;
127    info.view().set_margin(&mut activity, 10)?;
128    info.view().set_height_wrap_content(&mut activity)?;
129    info.view().set_linear_layout_params(&mut activity, 0, None)?;
130    info.set_text_color(&mut activity, 0xFF666666u32 as i32)?;
131    
132    // 状态显示
133    let status = activity.create_text_view("准备就绪 - 点击任意元素试试", Some(layout.id()))?;
134    status.view().set_margin(&mut activity, 10)?;
135    status.view().set_height_wrap_content(&mut activity)?;
136    status.view().set_linear_layout_params(&mut activity, 0, None)?;
137    status.set_text_color(&mut activity, 0xFF2196F3u32 as i32)?;
138    
139    println!("✓ 界面创建完成\n");
140    println!("━━━━━━━━━━━━━━━━━━━━━━");
141    println!("提示:");
142    println!("  • 观察三个不同尺寸的网格布局");
143    println!("  • 3×3 按钮网格:数字1-9");
144    println!("  • 2×4 表情网格:8个表情");
145    println!("  • 4×2 开关网格:8个ToggleButton");
146    println!("━━━━━━━━━━━━━━━━━━━━━━\n");
147    
148    // 事件循环
149    loop {
150        let event = read_message(activity.event_stream())?;
151        let event_type = event["type"].as_str().unwrap_or("");
152        let event_value = &event["value"];
153        
154        match event_type {
155            "destroy" => {
156                // Activity 已被系统销毁,直接退出即可
157                println!("\n✓ Activity 已关闭");
158                return Ok(());
159            },
160            "click" => {
161                let clicked_id = event_value["id"].as_i64().unwrap_or(-1);
162                
163                // 检查是否是第一个网格的按钮
164                for (i, btn) in grid1_buttons.iter().enumerate() {
165                    if clicked_id == btn.id() {
166                        println!("✅ 点击了数字按钮: {}", i + 1);
167                        status.set_text(&mut activity, &format!("✅ 点击了数字: {}", i + 1))?;
168                        status.set_text_color(&mut activity, 0xFF4CAF50u32 as i32)?;
169                        break;
170                    }
171                }
172                
173                // 检查是否是第三个网格的开关
174                for (i, toggle) in grid3_toggles.iter().enumerate() {
175                    if clicked_id == toggle.id() {
176                        let is_checked = event_value["set"].as_bool().unwrap_or(false);
177                        println!("🔘 {}: {}", toggle_labels[i], if is_checked { "开启" } else { "关闭" });
178                        status.set_text(&mut activity, 
179                            &format!("🔘 {}: {}", toggle_labels[i], if is_checked { "开启" } else { "关闭" }))?;
180                        status.set_text_color(&mut activity, 
181                            if is_checked { 0xFFFF9800u32 as i32 } else { 0xFF9E9E9Eu32 as i32 })?;
182                        break;
183                    }
184                }
185            },
186            _ => {}
187        }
188    }
189}