AIWROK软件苹果实例UI-垂直容器[Vertical]
AIWROK软件苹果实例UI-垂直容器// 🎨UI-垂直容器高级综合示例
// 全面展示Vertical容器的所有功能和方法
// 🍎交流QQ群711841924群一，苹果内测群，528816639
printl("=== Vertical容器高级综合示例启动 ===");
var tab = new TabView();
tab.setTitles(["基础", "对齐", "动态", "嵌套", "综合"]);
tab.show(function() {
printl("TabView界面加载完成");
// ====================== 第一页：基础布局 ======================
var basicPage = new Vertical();
basicPage.setSpacing(15);
basicPage.setBackgroundColor(245, 248, 250);
var basicHeader = new Horizontal();
basicHeader.setAlignment("center");
basicHeader.setBackgroundColor(70, 130, 180);
var basicHeaderLabel = new Label();
basicHeaderLabel.setText("基础布局演示");
basicHeaderLabel.setTextColor(255, 255, 255);
basicHeaderLabel.setFontSize(20);
basicHeader.addView(basicHeaderLabel);
basicPage.addView(basicHeader);
var basicDesc = new Label();
basicDesc.setText("展示Vertical容器的基本布局功能，包括间距、背景色、容器大小等基础属性");
basicDesc.setTextColor(100, 100, 100);
basicDesc.setFontSize(13);
basicDesc.setTextAlignment("center");
basicPage.addView(basicDesc);
var basicSection1 = new Horizontal();
basicSection1.setAlignment("center");
basicSection1.setBackgroundColor(220, 220, 225);
var basicSection1Label = new Label();
basicSection1Label.setText("容器属性设置");
basicSection1Label.setTextColor(60, 60, 60);
basicSection1Label.setFontSize(15);
basicSection1.addView(basicSection1Label);
basicPage.addView(basicSection1);
var basicDemo1 = new Vertical();
basicDemo1.setSpacing(10);
basicDemo1.setBackgroundColor(255, 255, 255);
basicDemo1.setContainerSize(350, 120);
var basicLabel1 = new Label();
basicLabel1.setText("间距: 10px | 背景色: 白色");
basicLabel1.setTextColor(60, 60, 60);
basicLabel1.setFontSize(14);
basicDemo1.addView(basicLabel1);
var basicLabel2 = new Label();
basicLabel2.setText("容器大小: 350x120");
basicLabel2.setTextColor(100, 100, 100);
basicLabel2.setFontSize(12);
basicDemo1.addView(basicLabel2);
var basicBtn1 = new Button();
basicBtn1.setText("测试按钮");
basicBtn1.setColor(70, 130, 180);
basicBtn1.setTextColor(255, 255, 255);
basicBtn1.onClick(function() {
printl("测试按钮被点击了！");
var feedbackLabel = new Label();
feedbackLabel.setText("按钮点击成功！");
feedbackLabel.setTextColor(0, 128, 0);
feedbackLabel.setFontSize(12);
basicDemo1.addView(feedbackLabel);
});
basicDemo1.addView(basicBtn1);
basicPage.addView(basicDemo1);
var basicSection2 = new Horizontal();
basicSection2.setAlignment("center");
basicSection2.setBackgroundColor(220, 220, 225);
var basicSection2Label = new Label();
basicSection2Label.setText("不同间距对比");
basicSection2Label.setTextColor(60, 60, 60);
basicSection2Label.setFontSize(15);
basicSection2.addView(basicSection2Label);
basicPage.addView(basicSection2);
var basicSpacingContainer = new Vertical();
basicSpacingContainer.setSpacing(8);
basicSpacingContainer.setBackgroundColor(255, 255, 255);
var basicSpacingDemo1 = new Vertical();
basicSpacingDemo1.setSpacing(5);
basicSpacingDemo1.setBackgroundColor(245, 245, 245);
var basicSpacingDemo1Label = new Label();
basicSpacingDemo1Label.setText("间距5px");
basicSpacingDemo1Label.setTextColor(80, 80, 80);
basicSpacingDemo1Label.setFontSize(13);
basicSpacingDemo1.addView(basicSpacingDemo1Label);
var basicSpacingDemo1Label2 = new Label();
basicSpacingDemo1Label2.setText("示例标签");
basicSpacingDemo1Label2.setTextColor(120, 120, 120);
basicSpacingDemo1Label2.setFontSize(11);
basicSpacingDemo1.addView(basicSpacingDemo1Label2);
var basicSpacingDemo1Btn = new Button();
basicSpacingDemo1Btn.setText("按钮");
basicSpacingDemo1Btn.setColor(150, 150, 150);
basicSpacingDemo1Btn.setTextColor(255, 255, 255);
basicSpacingDemo1Btn.setWidth(80);
basicSpacingDemo1Btn.setHeight(30);
basicSpacingDemo1.addView(basicSpacingDemo1Btn);
basicSpacingContainer.addView(basicSpacingDemo1);
var basicSpacingDemo2 = new Vertical();
basicSpacingDemo2.setSpacing(15);
basicSpacingDemo2.setBackgroundColor(245, 245, 245);
var basicSpacingDemo2Label = new Label();
basicSpacingDemo2Label.setText("间距15px");
basicSpacingDemo2Label.setTextColor(80, 80, 80);
basicSpacingDemo2Label.setFontSize(13);
basicSpacingDemo2.addView(basicSpacingDemo2Label);
var basicSpacingDemo2Label2 = new Label();
basicSpacingDemo2Label2.setText("示例标签");
basicSpacingDemo2Label2.setTextColor(120, 120, 120);
basicSpacingDemo2Label2.setFontSize(11);
basicSpacingDemo2.addView(basicSpacingDemo2Label2);
var basicSpacingDemo2Btn = new Button();
basicSpacingDemo2Btn.setText("按钮");
basicSpacingDemo2Btn.setColor(150, 150, 150);
basicSpacingDemo2Btn.setTextColor(255, 255, 255);
basicSpacingDemo2Btn.setWidth(80);
basicSpacingDemo2Btn.setHeight(30);
basicSpacingDemo2.addView(basicSpacingDemo2Btn);
basicSpacingContainer.addView(basicSpacingDemo2);
var basicSpacingDemo3 = new Vertical();
basicSpacingDemo3.setSpacing(25);
basicSpacingDemo3.setBackgroundColor(245, 245, 245);
var basicSpacingDemo3Label = new Label();
basicSpacingDemo3Label.setText("间距25px");
basicSpacingDemo3Label.setTextColor(80, 80, 80);
basicSpacingDemo3Label.setFontSize(13);
basicSpacingDemo3.addView(basicSpacingDemo3Label);
var basicSpacingDemo3Label2 = new Label();
basicSpacingDemo3Label2.setText("示例标签");
basicSpacingDemo3Label2.setTextColor(120, 120, 120);
basicSpacingDemo3Label2.setFontSize(11);
basicSpacingDemo3.addView(basicSpacingDemo3Label2);
var basicSpacingDemo3Btn = new Button();
basicSpacingDemo3Btn.setText("按钮");
basicSpacingDemo3Btn.setColor(150, 150, 150);
basicSpacingDemo3Btn.setTextColor(255, 255, 255);
basicSpacingDemo3Btn.setWidth(80);
basicSpacingDemo3Btn.setHeight(30);
basicSpacingDemo3.addView(basicSpacingDemo3Btn);
basicSpacingContainer.addView(basicSpacingDemo3);
basicPage.addView(basicSpacingContainer);
// ====================== 第二页：高级对齐 ======================
var alignPage = new Vertical();
alignPage.setSpacing(15);
alignPage.setBackgroundColor(250, 245, 248);
var alignHeader = new Horizontal();
alignHeader.setAlignment("center");
alignHeader.setBackgroundColor(70, 130, 180);
var alignHeaderLabel = new Label();
alignHeaderLabel.setText("高级对齐演示");
alignHeaderLabel.setTextColor(255, 255, 255);
alignHeaderLabel.setFontSize(20);
alignHeader.addView(alignHeaderLabel);
alignPage.addView(alignHeader);
var alignDesc = new Label();
alignDesc.setText("展示Vertical容器的各种对齐方式，包括left、center、right、fill四种对齐模式");
alignDesc.setTextColor(100, 100, 100);
alignDesc.setFontSize(13);
alignDesc.setTextAlignment("center");
alignPage.addView(alignDesc);
var alignSection1 = new Horizontal();
alignSection1.setAlignment("center");
alignSection1.setBackgroundColor(220, 220, 225);
var alignSection1Label = new Label();
alignSection1Label.setText("对齐方式对比");
alignSection1Label.setTextColor(60, 60, 60);
alignSection1Label.setFontSize(15);
alignSection1.addView(alignSection1Label);
alignPage.addView(alignSection1);
var alignLeft = new Vertical();
alignLeft.setSpacing(8);
alignLeft.setAlignment("left");
alignLeft.setBackgroundColor(230, 250, 230);
alignLeft.setContainerSize(350, 80);
var alignLeftLabel = new Label();
alignLeftLabel.setText("左对齐 (left)");
alignLeftLabel.setTextColor(60, 60, 60);
alignLeftLabel.setFontSize(14);
alignLeft.addView(alignLeftLabel);
var alignLeftLabel2 = new Label();
alignLeftLabel2.setText("对齐效果演示文本");
alignLeftLabel2.setTextColor(100, 100, 100);
alignLeftLabel2.setFontSize(12);
alignLeft.addView(alignLeftLabel2);
alignPage.addView(alignLeft);
var alignCenter = new Vertical();
alignCenter.setSpacing(8);
alignCenter.setAlignment("center");
alignCenter.setBackgroundColor(250, 230, 230);
alignCenter.setContainerSize(350, 80);
var alignCenterLabel = new Label();
alignCenterLabel.setText("居中对齐 (center)");
alignCenterLabel.setTextColor(60, 60, 60);
alignCenterLabel.setFontSize(14);
alignCenter.addView(alignCenterLabel);
var alignCenterLabel2 = new Label();
alignCenterLabel2.setText("对齐效果演示文本");
alignCenterLabel2.setTextColor(100, 100, 100);
alignCenterLabel2.setFontSize(12);
alignCenter.addView(alignCenterLabel2);
alignPage.addView(alignCenter);
var alignRight = new Vertical();
alignRight.setSpacing(8);
alignRight.setAlignment("right");
alignRight.setBackgroundColor(230, 230, 250);
alignRight.setContainerSize(350, 80);
var alignRightLabel = new Label();
alignRightLabel.setText("右对齐 (right)");
alignRightLabel.setTextColor(60, 60, 60);
alignRightLabel.setFontSize(14);
alignRight.addView(alignRightLabel);
var alignRightLabel2 = new Label();
alignRightLabel2.setText("对齐效果演示文本");
alignRightLabel2.setTextColor(100, 100, 100);
alignRightLabel2.setFontSize(12);
alignRight.addView(alignRightLabel2);
alignPage.addView(alignRight);
var alignFill = new Vertical();
alignFill.setSpacing(8);
alignFill.setAlignment("fill");
alignFill.setBackgroundColor(250, 250, 230);
alignFill.setContainerSize(350, 80);
var alignFillLabel = new Label();
alignFillLabel.setText("填充对齐 (fill)");
alignFillLabel.setTextColor(60, 60, 60);
alignFillLabel.setFontSize(14);
alignFill.addView(alignFillLabel);
var alignFillLabel2 = new Label();
alignFillLabel2.setText("对齐效果演示文本");
alignFillLabel2.setTextColor(100, 100, 100);
alignFillLabel2.setFontSize(12);
alignFill.addView(alignFillLabel2);
alignPage.addView(alignFill);
// ====================== 第三页：动态管理 ======================
var dynamicPage = new Vertical();
dynamicPage.setSpacing(15);
dynamicPage.setBackgroundColor(248, 250, 245);
var dynamicHeader = new Horizontal();
dynamicHeader.setAlignment("center");
dynamicHeader.setBackgroundColor(70, 130, 180);
var dynamicHeaderLabel = new Label();
dynamicHeaderLabel.setText("动态管理演示");
dynamicHeaderLabel.setTextColor(255, 255, 255);
dynamicHeaderLabel.setFontSize(20);
dynamicHeader.addView(dynamicHeaderLabel);
dynamicPage.addView(dynamicHeader);
var dynamicDesc = new Label();
dynamicDesc.setText("展示动态添加、删除、清空控件的功能，以及控件数量统计");
dynamicDesc.setTextColor(100, 100, 100);
dynamicDesc.setFontSize(13);
dynamicDesc.setTextAlignment("center");
dynamicPage.addView(dynamicDesc);
var dynamicSection1 = new Horizontal();
dynamicSection1.setAlignment("center");
dynamicSection1.setBackgroundColor(220, 220, 225);
var dynamicSection1Label = new Label();
dynamicSection1Label.setText("动态添加控件");
dynamicSection1Label.setTextColor(60, 60, 60);
dynamicSection1Label.setFontSize(15);
dynamicSection1.addView(dynamicSection1Label);
dynamicPage.addView(dynamicSection1);
var dynamicAddContainer = new Vertical();
dynamicAddContainer.setSpacing(10);
dynamicAddContainer.setBackgroundColor(255, 255, 255);
var dynamicAddStatus = new Label();
dynamicAddStatus.setText("当前控件数量: 0");
dynamicAddStatus.setTextColor(80, 80, 80);
dynamicAddStatus.setFontSize(14);
dynamicAddContainer.addView(dynamicAddStatus);
var dynamicAddButton = new Button();
dynamicAddButton.setText("添加新控件");
dynamicAddButton.setColor(46, 139, 87);
dynamicAddButton.setTextColor(255, 255, 255);
dynamicAddButton.onClick(function() {
var newLabel = new Label();
var count = dynamicAddContainer.getViewCount();
newLabel.setText("动态添加的标签 #" + (count - 1));
newLabel.setTextColor(100, 100, 100);
newLabel.setFontSize(12);
dynamicAddContainer.addView(newLabel);
dynamicAddStatus.setText("当前控件数量: " + dynamicAddContainer.getViewCount());
printl("已添加控件，当前数量: " + dynamicAddContainer.getViewCount());
});
dynamicAddContainer.addView(dynamicAddButton);
dynamicPage.addView(dynamicAddContainer);
var dynamicSection2 = new Horizontal();
dynamicSection2.setAlignment("center");
dynamicSection2.setBackgroundColor(220, 220, 225);
var dynamicSection2Label = new Label();
dynamicSection2Label.setText("动态删除控件");
dynamicSection2Label.setTextColor(60, 60, 60);
dynamicSection2Label.setFontSize(15);
dynamicSection2.addView(dynamicSection2Label);
dynamicPage.addView(dynamicSection2);
var dynamicRemoveContainer = new Vertical();
dynamicRemoveContainer.setSpacing(10);
dynamicRemoveContainer.setBackgroundColor(255, 255, 255);
var dynamicRemoveLabels = [];
for (var i = 1; i <= 5; i++) {
var tempLabel = new Label();
tempLabel.setText("可删除标签 " + i);
tempLabel.setTextColor(100, 100, 100);
tempLabel.setFontSize(12);
dynamicRemoveLabels.push(tempLabel);
dynamicRemoveContainer.addView(tempLabel);
}
var dynamicRemoveStatus = new Label();
dynamicRemoveStatus.setText("当前控件数量: " + dynamicRemoveContainer.getViewCount());
dynamicRemoveStatus.setTextColor(80, 80, 80);
dynamicRemoveStatus.setFontSize(14);
dynamicRemoveContainer.addView(dynamicRemoveStatus);
var dynamicRemoveButton = new Button();
dynamicRemoveButton.setText("删除第一个控件");
dynamicRemoveButton.setColor(220, 20, 60);
dynamicRemoveButton.setTextColor(255, 255, 255);
dynamicRemoveButton.onClick(function() {
printl("删除按钮被点击，当前控件数量: " + dynamicRemoveContainer.getViewCount());
printl("dynamicRemoveLabels数组长度: " + dynamicRemoveLabels.length);
if (dynamicRemoveLabels.length > 0) {
// 移除第一个标签
dynamicRemoveLabels.shift();
// 清空所有控件
dynamicRemoveContainer.clearAllViews();
// 重新添加剩余的标签
for (var i = 0; i < dynamicRemoveLabels.length; i++) {
dynamicRemoveContainer.addView(dynamicRemoveLabels);
}
// 重新添加状态标签和按钮
dynamicRemoveContainer.addView(dynamicRemoveStatus);
dynamicRemoveContainer.addView(dynamicRemoveButton);
dynamicRemoveContainer.addView(dynamicClearButton);
// 更新状态
dynamicRemoveStatus.setText("当前控件数量: " + dynamicRemoveContainer.getViewCount());
printl("已删除控件，剩余数量: " + dynamicRemoveContainer.getViewCount());
} else {
printl("控件数量不足，无法继续删除");
}
});
dynamicRemoveContainer.addView(dynamicRemoveButton);
var dynamicClearButton = new Button();
dynamicClearButton.setText("清空所有控件");
dynamicClearButton.setColor(148, 0, 211);
dynamicClearButton.setTextColor(255, 255, 255);
dynamicClearButton.onClick(function() {
dynamicRemoveContainer.clearAllViews();
dynamicRemoveLabels = [];
var emptyLabel = new Label();
emptyLabel.setText("所有控件已清空");
emptyLabel.setTextColor(150, 150, 150);
emptyLabel.setFontSize(12);
dynamicRemoveContainer.addView(emptyLabel);
dynamicRemoveContainer.addView(dynamicRemoveStatus);
dynamicRemoveContainer.addView(dynamicRemoveButton);
dynamicRemoveContainer.addView(dynamicClearButton);
dynamicRemoveStatus.setText("当前控件数量: " + dynamicRemoveContainer.getViewCount());
printl("已清空所有控件");
});
dynamicRemoveContainer.addView(dynamicClearButton);
dynamicPage.addView(dynamicRemoveContainer);
// ====================== 第四页：嵌套容器 ======================
var nestedPage = new Vertical();
nestedPage.setSpacing(15);
nestedPage.setBackgroundColor(245, 248, 250);
var nestedHeader = new Horizontal();
nestedHeader.setAlignment("center");
nestedHeader.setBackgroundColor(70, 130, 180);
var nestedHeaderLabel = new Label();
nestedHeaderLabel.setText("嵌套容器演示");
nestedHeaderLabel.setTextColor(255, 255, 255);
nestedHeaderLabel.setFontSize(20);
nestedHeader.addView(nestedHeaderLabel);
nestedPage.addView(nestedHeader);
var nestedDesc = new Label();
nestedDesc.setText("展示Vertical容器与其他容器的嵌套使用，包括Vertical、Horizontal的组合布局");
nestedDesc.setTextColor(100, 100, 100);
nestedDesc.setFontSize(13);
nestedDesc.setTextAlignment("center");
nestedPage.addView(nestedDesc);
var nestedSection1 = new Horizontal();
nestedSection1.setAlignment("center");
nestedSection1.setBackgroundColor(220, 220, 225);
var nestedSection1Label = new Label();
nestedSection1Label.setText("Vertical嵌套Horizontal");
nestedSection1Label.setTextColor(60, 60, 60);
nestedSection1Label.setFontSize(15);
nestedSection1.addView(nestedSection1Label);
nestedPage.addView(nestedSection1);
var nestedContainer1 = new Vertical();
nestedContainer1.setSpacing(12);
nestedContainer1.setBackgroundColor(255, 255, 255);
for (var i = 1; i <= 3; i++) {
var row = new Horizontal();
row.setSpacing(10);
row.setAlignment("center");
row.setBackgroundColor(240, 240, 245);
var rowLabel = new Label();
rowLabel.setText("第 " + i + " 行");
rowLabel.setTextColor(60, 60, 60);
rowLabel.setFontSize(14);
row.addView(rowLabel);
var rowButton = new Button();
rowButton.setText("按钮" + i);
rowButton.setColor(70, 130, 180);
rowButton.setTextColor(255, 255, 255);
rowButton.setWidth(80);
rowButton.setHeight(35);
rowButton.onClick(function() {
printl("嵌套容器中的按钮被点击");
});
row.addView(rowButton);
nestedContainer1.addView(row);
}
nestedPage.addView(nestedContainer1);
var nestedSection2 = new Horizontal();
nestedSection2.setAlignment("center");
nestedSection2.setBackgroundColor(220, 220, 225);
var nestedSection2Label = new Label();
nestedSection2Label.setText("多层嵌套结构");
nestedSection2Label.setTextColor(60, 60, 60);
nestedSection2Label.setFontSize(15);
nestedSection2.addView(nestedSection2Label);
nestedPage.addView(nestedSection2);
var nestedMultiLevelContainer = new Vertical();
nestedMultiLevelContainer.setSpacing(10);
nestedMultiLevelContainer.setBackgroundColor(255, 255, 255);
var nestedLevel1Label = new Label();
nestedLevel1Label.setText("第一层：Vertical容器");
nestedLevel1Label.setTextColor(80, 80, 80);
nestedLevel1Label.setFontSize(13);
nestedMultiLevelContainer.addView(nestedLevel1Label);
var nestedLevel2Container = new Vertical();
nestedLevel2Container.setSpacing(8);
nestedLevel2Container.setBackgroundColor(245, 245, 245);
var nestedLevel2Label = new Label();
nestedLevel2Label.setText("第二层：嵌套的Vertical容器");
nestedLevel2Label.setTextColor(100, 100, 100);
nestedLevel2Label.setFontSize(12);
nestedLevel2Container.addView(nestedLevel2Label);
var nestedLevel3Container = new Horizontal();
nestedLevel3Container.setSpacing(10);
nestedLevel3Container.setAlignment("center");
nestedLevel3Container.setBackgroundColor(240, 240, 240);
var nestedLevel3Label = new Label();
nestedLevel3Label.setText("第三层：Horizontal容器");
nestedLevel3Label.setTextColor(120, 120, 120);
nestedLevel3Label.setFontSize(11);
nestedLevel3Container.addView(nestedLevel3Label);
var nestedLevel3Button = new Button();
nestedLevel3Button.setText("测试");
nestedLevel3Button.setColor(100, 149, 237);
nestedLevel3Button.setTextColor(255, 255, 255);
nestedLevel3Button.setWidth(60);
nestedLevel3Button.setHeight(30);
nestedLevel3Container.addView(nestedLevel3Button);
nestedLevel2Container.addView(nestedLevel3Container);
nestedMultiLevelContainer.addView(nestedLevel2Container);
nestedPage.addView(nestedMultiLevelContainer);
// ====================== 第五页：综合演示 ======================
var comprehensivePage = new Vertical();
comprehensivePage.setSpacing(15);
comprehensivePage.setBackgroundColor(248, 245, 250);
var comprehensiveHeader = new Horizontal();
comprehensiveHeader.setAlignment("center");
comprehensiveHeader.setBackgroundColor(70, 130, 180);
var comprehensiveHeaderLabel = new Label();
comprehensiveHeaderLabel.setText("综合演示");
comprehensiveHeaderLabel.setTextColor(255, 255, 255);
comprehensiveHeaderLabel.setFontSize(20);
comprehensiveHeader.addView(comprehensiveHeaderLabel);
comprehensivePage.addView(comprehensiveHeader);
var comprehensiveDesc = new Label();
comprehensiveDesc.setText("综合展示Vertical容器的所有功能，包括属性设置、对齐、动态管理、嵌套等");
comprehensiveDesc.setTextColor(100, 100, 100);
comprehensiveDesc.setFontSize(13);
comprehensiveDesc.setTextAlignment("center");
comprehensivePage.addView(comprehensiveDesc);
var comprehensiveSection1 = new Horizontal();
comprehensiveSection1.setAlignment("center");
comprehensiveSection1.setBackgroundColor(220, 220, 225);
var comprehensiveSection1Label = new Label();
comprehensiveSection1Label.setText("综合功能展示");
comprehensiveSection1Label.setTextColor(60, 60, 60);
comprehensiveSection1Label.setFontSize(15);
comprehensiveSection1.addView(comprehensiveSection1Label);
comprehensivePage.addView(comprehensiveSection1);
var comprehensiveContainer = new Vertical();
comprehensiveContainer.setSpacing(12);
comprehensiveContainer.setBackgroundColor(255, 255, 255);
comprehensiveContainer.setAlignment("center");
var comprehensiveTitleLabel = new Label();
comprehensiveTitleLabel.setText("综合功能演示区域");
comprehensiveTitleLabel.setTextColor(50, 50, 50);
comprehensiveTitleLabel.setFontSize(16);
comprehensiveTitleLabel.setTextAlignment("center");
comprehensiveContainer.addView(comprehensiveTitleLabel);
var comprehensiveInfoPanel = new Horizontal();
comprehensiveInfoPanel.setSpacing(15);
comprehensiveInfoPanel.setAlignment("center");
comprehensiveInfoPanel.setBackgroundColor(245, 245, 245);
var comprehensiveInfo1 = new Label();
comprehensiveInfo1.setText("间距: 12px");
comprehensiveInfo1.setTextColor(100, 100, 100);
comprehensiveInfo1.setFontSize(12);
comprehensiveInfoPanel.addView(comprehensiveInfo1);
var comprehensiveInfo2 = new Label();
comprehensiveInfo2.setText("对齐: center");
comprehensiveInfo2.setTextColor(100, 100, 100);
comprehensiveInfo2.setFontSize(12);
comprehensiveInfoPanel.addView(comprehensiveInfo2);
var comprehensiveInfo3 = new Label();
comprehensiveInfo3.setText("背景: 白色");
comprehensiveInfo3.setTextColor(100, 100, 100);
comprehensiveInfo3.setFontSize(12);
comprehensiveInfoPanel.addView(comprehensiveInfo3);
comprehensiveContainer.addView(comprehensiveInfoPanel);
var comprehensiveButtonPanel = new Horizontal();
comprehensiveButtonPanel.setSpacing(10);
comprehensiveButtonPanel.setAlignment("center");
var comprehensiveBtnAdd = new Button();
comprehensiveBtnAdd.setText("添加");
comprehensiveBtnAdd.setColor(46, 139, 87);
comprehensiveBtnAdd.setTextColor(255, 255, 255);
comprehensiveBtnAdd.setWidth(70);
comprehensiveBtnAdd.setHeight(40);
var comprehensiveItems = [];
comprehensiveBtnAdd.onClick(function() {
var newItem = new Label();
newItem.setText("动态添加项 - " + new Date().getTime());
newItem.setTextColor(80, 80, 80);
newItem.setFontSize(12);
comprehensiveItems.push(newItem);
comprehensiveContainer.addView(newItem);
printl("综合演示：已添加新项");
});
comprehensiveButtonPanel.addView(comprehensiveBtnAdd);
var comprehensiveBtnRemove = new Button();
comprehensiveBtnRemove.setText("删除");
comprehensiveBtnRemove.setColor(220, 20, 60);
comprehensiveBtnRemove.setTextColor(255, 255, 255);
comprehensiveBtnRemove.setWidth(70);
comprehensiveBtnRemove.setHeight(40);
comprehensiveBtnRemove.onClick(function() {
printl("删除按钮被点击，当前控件数量: " + comprehensiveContainer.getViewCount());
printl("comprehensiveItems数组长度: " + comprehensiveItems.length);
if (comprehensiveItems.length > 0) {
// 移除第一个项
comprehensiveItems.shift();
// 清空所有控件
comprehensiveContainer.clearAllViews();
// 重新添加固定控件
comprehensiveContainer.addView(comprehensiveTitleLabel);
comprehensiveContainer.addView(comprehensiveInfoPanel);
comprehensiveContainer.addView(comprehensiveButtonPanel);
// 重新添加剩余的项
for (var i = 0; i < comprehensiveItems.length; i++) {
comprehensiveContainer.addView(comprehensiveItems);
}
printl("综合演示：已删除第一项");
} else {
printl("综合演示：控件数量不足");
}
});
comprehensiveButtonPanel.addView(comprehensiveBtnRemove);
var comprehensiveBtnClear = new Button();
comprehensiveBtnClear.setText("清空");
comprehensiveBtnClear.setColor(148, 0, 211);
comprehensiveBtnClear.setTextColor(255, 255, 255);
comprehensiveBtnClear.setWidth(70);
comprehensiveBtnClear.setHeight(40);
comprehensiveBtnClear.onClick(function() {
comprehensiveItems = [];
comprehensiveContainer.clearAllViews();
comprehensiveContainer.addView(comprehensiveTitleLabel);
comprehensiveContainer.addView(comprehensiveInfoPanel);
comprehensiveContainer.addView(comprehensiveButtonPanel);
printl("综合演示：已清空所有控件");
});
comprehensiveButtonPanel.addView(comprehensiveBtnClear);
comprehensiveContainer.addView(comprehensiveButtonPanel);
var comprehensiveCountLabel = new Label();
comprehensiveCountLabel.setText("当前控件数量: " + comprehensiveContainer.getViewCount());
comprehensiveCountLabel.setTextColor(80, 80, 80);
comprehensiveCountLabel.setFontSize(12);
comprehensiveContainer.addView(comprehensiveCountLabel);
comprehensivePage.addView(comprehensiveContainer);
var comprehensiveSection2 = new Horizontal();
comprehensiveSection2.setAlignment("center");
comprehensiveSection2.setBackgroundColor(220, 220, 225);
var comprehensiveSection2Label = new Label();
comprehensiveSection2Label.setText("方法总结");
comprehensiveSection2Label.setTextColor(60, 60, 60);
comprehensiveSection2Label.setFontSize(15);
comprehensiveSection2.addView(comprehensiveSection2Label);
comprehensivePage.addView(comprehensiveSection2);
var comprehensiveSummaryContainer = new Vertical();
comprehensiveSummaryContainer.setSpacing(8);
comprehensiveSummaryContainer.setBackgroundColor(255, 255, 255);
var comprehensiveSummaryItems = [
"setSpacing(value) - 设置控件间距",
"setBackgroundColor(r, g, b) - 设置背景颜色",
"setContainerSize(width, height) - 设置容器大小",
"setAlignment(alignment) - 设置对齐方式",
"addView(view) - 添加子控件",
"clearAllViews() - 清空所有控件",
"getViewCount() - 获取控件数量"
];
for (var i = 0; i < comprehensiveSummaryItems.length; i++) {
var itemLabel = new Label();
itemLabel.setText(comprehensiveSummaryItems);
itemLabel.setTextColor(80, 80, 80);
itemLabel.setFontSize(12);
comprehensiveSummaryContainer.addView(itemLabel);
}
comprehensivePage.addView(comprehensiveSummaryContainer);
// 添加所有页面到TabView
tab.addView(0, basicPage);
tab.addView(1, alignPage);
tab.addView(2, dynamicPage);
tab.addView(3, nestedPage);
tab.addView(4, comprehensivePage);
printl("所有页面初始化完成");
});
页:
[1]