AIWROK软件苹果UI按钮Button方法示例

信息发布软件

	AIWROK软件苹果UI按钮Button方法示例 // Button综合示例 - 全面展示Button的各种用法和样式 // // 🍎交流QQ群711841924群一，苹果内测群：528816639 // 创建TabView var tab = new TabView(); // 设置Tab标题 var titles = ["Button示例"]; tab.setTitles(titles); // 创建主界面 var mainView = new Vertical(); mainView.setBackgroundColor(245, 245, 245); mainView.setSpacing(20); // 添加标题 var titleLabel = new Label(); titleLabel.setText("Button综合示例"); titleLabel.setTextColor(50, 100, 150); titleLabel.setFontSize(24); mainView.addView(titleLabel); // 添加基本按钮示例 addSection(mainView, "基本按钮示例"); addBasicButtonExample(mainView); // 添加彩色按钮示例 addSection(mainView, "彩色按钮示例"); addColorButtonExample(mainView); // 添加交互按钮示例 addSection(mainView, "交互按钮示例"); addInteractiveButtonExample(mainView); // 添加状态按钮示例 addSection(mainView, "状态按钮示例"); addStateButtonExample(mainView); // 添加布局按钮示例 addSection(mainView, "布局按钮示例"); addLayoutButtonExample(mainView); // 添加高级按钮示例 addSection(mainView, "高级按钮示例"); addAdvancedButtonExample(mainView); // 显示主界面 tab.show(() => {     printl("Button示例界面已加载完成");     tab.addView(0, mainView); }); // 添加 section 标题 function addSection(container, title) {     var sectionLabel = new Label();     sectionLabel.setText(title);     sectionLabel.setTextColor(80, 80, 80);     sectionLabel.setFontSize(18);     // 添加间距标签作为替代     var spacing = new Label();     spacing.setHeight(20);     container.addView(spacing);     container.addView(sectionLabel);     var bottomSpacing = new Label();     bottomSpacing.setHeight(10);     container.addView(bottomSpacing); } // 基本按钮示例 function addBasicButtonExample(container) {     var buttonContainer = new Horizontal();     buttonContainer.setSpacing(20);         // 基本按钮     var basicBtn = new Button();     basicBtn.setText("基本按钮");     basicBtn.setWidth(120);     basicBtn.setHeight(40);     basicBtn.onClick(() => {         printl("基本按钮被点击");         showToast("基本按钮被点击");     });     buttonContainer.addView(basicBtn);         // 获取按钮文本     var getTextBtn = new Button();     getTextBtn.setText("获取文本");     getTextBtn.setWidth(120);     getTextBtn.setHeight(40);     getTextBtn.onClick(() => {         var text = getTextBtn.getText();         printl("按钮文本: " + text);         showToast("按钮文本: " + text);     });     buttonContainer.addView(getTextBtn);         container.addView(buttonContainer); } // 彩色按钮示例 function addColorButtonExample(container) {     var buttonContainer = new Horizontal();     buttonContainer.setSpacing(15);         // 蓝色按钮     var blueBtn = new Button();     blueBtn.setText("蓝色按钮");     blueBtn.setColor(50, 100, 150);     blueBtn.setTextColor(255, 255, 255);     blueBtn.setWidth(100);     blueBtn.setHeight(40);     blueBtn.onClick(() => {         showToast("蓝色按钮被点击");     });     buttonContainer.addView(blueBtn);         // 红色按钮     var redBtn = new Button();     redBtn.setText("红色按钮");     redBtn.setColor(200, 50, 50);     redBtn.setTextColor(255, 255, 255);     redBtn.setWidth(100);     redBtn.setHeight(40);     redBtn.onClick(() => {         showToast("红色按钮被点击");     });     buttonContainer.addView(redBtn);         // 绿色按钮     var greenBtn = new Button();     greenBtn.setText("绿色按钮");     greenBtn.setColor(50, 150, 50);     greenBtn.setTextColor(255, 255, 255);     greenBtn.setWidth(100);     greenBtn.setHeight(40);     greenBtn.onClick(() => {         showToast("绿色按钮被点击");     });     buttonContainer.addView(greenBtn);         container.addView(buttonContainer); } // 交互按钮示例 function addInteractiveButtonExample(container) {     var buttonContainer = new Vertical();     buttonContainer.setSpacing(15);         // 计数器按钮     var count = 0;     var countBtn = new Button();     countBtn.setText("点击次数: " + count);     countBtn.setWidth(200);     countBtn.setHeight(45);     countBtn.setColor(70, 130, 180);     countBtn.setTextColor(255, 255, 255);     countBtn.onClick(() => {         count++;         countBtn.setText("点击次数: " + count);         showToast("点击次数: " + count);     });     buttonContainer.addView(countBtn);         // 切换文本按钮     var toggleBtn = new Button();     toggleBtn.setText("显示更多");     toggleBtn.setWidth(150);     toggleBtn.setHeight(40);     toggleBtn.onClick(() => {         var currentText = toggleBtn.getText();         if (currentText === "显示更多") {             toggleBtn.setText("显示更少");         } else {             toggleBtn.setText("显示更多");         }         showToast("按钮文本已切换");     });     buttonContainer.addView(toggleBtn);         container.addView(buttonContainer); } // 状态按钮示例 function addStateButtonExample(container) {     var buttonContainer = new Horizontal();     buttonContainer.setSpacing(20);         // 启用/禁用按钮     var enableBtn = new Button();     enableBtn.setText("禁用按钮");     enableBtn.setWidth(120);     enableBtn.setHeight(40);     enableBtn.setColor(150, 150, 150);     enableBtn.setTextColor(255, 255, 255);         var targetBtn = new Button();     targetBtn.setText("目标按钮");     targetBtn.setWidth(120);     targetBtn.setHeight(40);     targetBtn.onClick(() => {         showToast("目标按钮被点击");     });         enableBtn.onClick(() => {         var currentText = enableBtn.getText();         if (currentText === "禁用按钮") {             enableBtn.setText("启用按钮");             targetBtn.setColor(150, 150, 150);             targetBtn.setTextColor(200, 200, 200);             // 实际应用中可能需要设置一个标志来禁用点击             showToast("按钮已禁用");         } else {             enableBtn.setText("禁用按钮");             targetBtn.setColor(50, 100, 150);             targetBtn.setTextColor(255, 255, 255);             showToast("按钮已启用");         }     });         buttonContainer.addView(enableBtn);     buttonContainer.addView(targetBtn);         container.addView(buttonContainer); } // 布局按钮示例 function addLayoutButtonExample(container) {     var buttonContainer = new Vertical();     buttonContainer.setSpacing(15);         // 水平布局按钮组     var horizontalGroup = new Horizontal();     horizontalGroup.setSpacing(10);         var hBtn1 = new Button();     hBtn1.setText("按钮1");     hBtn1.setWidth(80);     hBtn1.setHeight(40);     hBtn1.onClick(() => showToast("按钮1被点击"));         var hBtn2 = new Button();     hBtn2.setText("按钮2");     hBtn2.setWidth(80);     hBtn2.setHeight(40);     hBtn2.onClick(() => showToast("按钮2被点击"));         var hBtn3 = new Button();     hBtn3.setText("按钮3");     hBtn3.setWidth(80);     hBtn3.setHeight(40);     hBtn3.onClick(() => showToast("按钮3被点击"));         horizontalGroup.addView(hBtn1);     horizontalGroup.addView(hBtn2);     horizontalGroup.addView(hBtn3);         buttonContainer.addView(horizontalGroup);         // 垂直布局按钮组     var verticalGroup = new Vertical();     verticalGroup.setSpacing(10);         var vBtn1 = new Button();     vBtn1.setText("垂直按钮1");     vBtn1.setWidth(150);     vBtn1.setHeight(40);     vBtn1.onClick(() => showToast("垂直按钮1被点击"));         var vBtn2 = new Button();     vBtn2.setText("垂直按钮2");     vBtn2.setWidth(150);     vBtn2.setHeight(40);     vBtn2.onClick(() => showToast("垂直按钮2被点击"));         verticalGroup.addView(vBtn1);     verticalGroup.addView(vBtn2);         buttonContainer.addView(verticalGroup);         container.addView(buttonContainer); } // 高级按钮示例 function addAdvancedButtonExample(container) {     var buttonContainer = new Vertical();     buttonContainer.setSpacing(15);         // 带图标效果的按钮（模拟）     var iconBtn = new Button();     iconBtn.setText("🔍 搜索");     iconBtn.setWidth(120);     iconBtn.setHeight(40);     iconBtn.setColor(70, 130, 180);     iconBtn.setTextColor(255, 255, 255);     iconBtn.onClick(() => {         showToast("搜索按钮被点击");     });     buttonContainer.addView(iconBtn);         // 长文本按钮     var longTextBtn = new Button();     longTextBtn.setText("这是一个很长很长的按钮文本示例");     longTextBtn.setWidth(200);     longTextBtn.setHeight(40);     longTextBtn.onClick(() => {         showToast("长文本按钮被点击");     });     buttonContainer.addView(longTextBtn);         // 确认/取消按钮组     var confirmGroup = new Horizontal();     confirmGroup.setSpacing(20);         var confirmBtn = new Button();     confirmBtn.setText("确认");     confirmBtn.setWidth(100);     confirmBtn.setHeight(40);     confirmBtn.setColor(50, 150, 50);     confirmBtn.setTextColor(255, 255, 255);     confirmBtn.onClick(() => {         showToast("确认操作");     });         var cancelBtn = new Button();     cancelBtn.setText("取消");     cancelBtn.setWidth(100);     cancelBtn.setHeight(40);     cancelBtn.setColor(150, 150, 150);     cancelBtn.setTextColor(255, 255, 255);     cancelBtn.onClick(() => {         showToast("取消操作");     });         confirmGroup.addView(confirmBtn);     confirmGroup.addView(cancelBtn);         buttonContainer.addView(confirmGroup);         container.addView(buttonContainer); } // 显示提示信息 function showToast(message) {     printl("提示: " + message);     // 实际应用中可以调用原生的toast功能 } // 日志输出函数 function printl(message) {     console.log("[Button Example] " + message); } // 代码说明： // 1. 本示例展示了Button的各种用法和样式 // 2. 包括基本按钮、彩色按钮、交互按钮、状态按钮、布局按钮和高级按钮 // 3. 实现了按钮点击事件、文本修改、颜色变化等交互功能 // 4. 代码遵循AIWROK平台的方法规范 // 5. 可以根据实际需求修改和扩展功能 复制代码