|
|
AIWROKÆ»¹û½Å±¾ÊµÀý1½çÃæUIÊäÈë¿òÀà[Input]
- // =============================================================================
- // 🎨 UI-ÊäÈë¿òÀà[Input]È«ÐÂϵͳ»¯Ê¾Àý
- // 📱 ÊÊÓÃÓÚÆ»¹ûiOSϵͳ - AIWROK IDE
- //🍎½»Á÷QQȺ711841924Ⱥһ£¬Æ»¹ûÄÚ²âȺ£¬528816639
- // =============================================================================
- //
- // ±¾Ê¾ÀýÈ«ÃæÕ¹Ê¾Input¿Ø¼þµÄËùÓй¦ÄÜ£¬²ÉÓÃTabView¶àÒ³Ãæ¼Ü¹¹£¬
- // ϵͳ»¯µØÑÝʾÿ¸ö·½·¨µÄʹÓó¡¾°ºÍ×î¼Ñʵ¼ù¡£
- //
- // Input¿Ø¼þ·½·¨Çåµ¥£º
- // 1. setText(text) - ÉèÖÃÊäÈë¿òÎı¾ÄÚÈÝ
- // 2. getText() - »ñÈ¡ÊäÈë¿òÎı¾ÄÚÈÝ
- // 3. setID(id) - ÉèÖÿؼþΨһ±êʶ·û
- // 4. setDefultText(text) - ÉèÖÃĬÈÏÎı¾£¨ÅäºÏconfigʹÓã©
- // 5. setTextColor(r, g, b) - ÉèÖÃÎı¾ÑÕÉ«
- // 6. setFontSize(size) - ÉèÖÃ×ÖÌå´óС
- // 7. setBackgroundColor(r, g, b) - ÉèÖñ³¾°ÑÕÉ«
- // 8. setWidth(width) - ÉèÖÿؼþ¿í¶È
- // 9. setHeight(height) - ÉèÖÿؼþ¸ß¶È
- // 10. setPlaceholder(text) - ÉèÖÃռλÌáʾÎı¾
- // 11. setTextAlignment(align) - ÉèÖÃÎı¾¶ÔÆë·½Ê½
- // 12. setInputStyle(isLineStyle) - ÉèÖÃÊäÈë¿òÑùʽ
- // =============================================================================
- printl("=== InputÊäÈë¿ò¿Ø¼þÈ«ÐÂϵͳ»¯Ê¾ÀýÆô¶¯ ===");
- // ´´½¨TabViewÖ÷ÈÝÆ÷
- var tab = new TabView();
- // ÉèÖÃTabÒ³Ãæ±êÌâ
- var tabTitles = [
- "»ù´¡",
- "Ñùʽ",
- "¸ß¼¶",
- "×ÛºÏ",
- "¹ØÓÚ"
- ];
- tab.setTitles(tabTitles);
- // ÏÔʾTabView²¢³õʼ»¯ËùÓÐÒ³Ãæ
- tab.show(function() {
- // ¹¹½¨¸÷¸öÒ³Ãæ
- buildBasicPage();
- buildStylePage();
- buildAdvancedPage();
- buildApplicationPage();
- buildAboutPage();
- });
- // =============================================================================
- // µÚÒ»Ò³£º»ù´¡·½·¨ÑÝʾ
- // =============================================================================
- function buildBasicPage() {
- var page = new Vertical();
- page.setSpacing(0);
- page.setBackgroundColor(245, 245, 250);
- // ·½·¨1£ºsetText - ÉèÖÃÎı¾
- var section1 = createMethodSection(
- "·½·¨1£ºsetText",
- "ÉèÖÃÊäÈë¿òµÄÎı¾ÄÚÈÝ",
- "input.setText(\"Hello World\");"
- );
-
- var input1 = new Input();
- input1.setText("Ô¤ÉèµÄÎı¾ÄÚÈÝ");
- input1.setWidth(280);
- input1.setHeight(42);
- input1.setBackgroundColor(255, 255, 255);
- section1.addView(input1);
-
- var btn1 = createActionButton("ÐÞ¸ÄÎı¾", function() {
- input1.setText("Îı¾Òѱ»Ð޸ģ¡");
- printl("setText·½·¨ÑÝʾ£ºÎı¾ÒÑÐÞ¸Ä");
- });
- section1.addView(btn1);
- page.addView(section1);
-
- // ·½·¨2£ºgetText - »ñÈ¡Îı¾
- var section2 = createMethodSection(
- "·½·¨2£ºgetText",
- "»ñÈ¡ÊäÈë¿òµ±Ç°Îı¾ÄÚÈÝ",
- "var text = input.getText();"
- );
-
- var input2 = new Input();
- input2.setPlaceholder("ÔÚ´ËÊäÈëÄÚÈݺóµã»÷»ñÈ¡");
- input2.setWidth(280);
- input2.setHeight(42);
- input2.setBackgroundColor(255, 255, 255);
- section2.addView(input2);
-
- var resultLabel2 = createResultLabel("µÈ´ý»ñÈ¡...");
-
- var btn2 = createActionButton("»ñÈ¡Îı¾", function() {
- var text = input2.getText();
- resultLabel2.setText("»ñÈ¡½á¹û: \"" + text + "\"");
- printl("getText·½·¨ÑÝʾ£º»ñÈ¡µ½Îı¾ \"" + text + "\"");
- });
- section2.addView(btn2);
- section2.addView(resultLabel2);
- page.addView(section2);
-
- // ·½·¨3£ºsetID - ÉèÖÿؼþID
- var section3 = createMethodSection(
- "·½·¨3£ºsetID",
- "ÉèÖÿؼþΨһ±êʶ·û£¬ÓÃÓÚÅäÖô洢",
- "input.setID(\"username\");"
- );
-
- var input3 = new Input();
- input3.setID("demo_input_id");
- input3.setPlaceholder("ÒÑÉèÖÃID: demo_input_id");
- input3.setWidth(280);
- input3.setHeight(42);
- input3.setBackgroundColor(255, 255, 255);
- section3.addView(input3);
-
- var btn3 = createActionButton("¶ÁÈ¡ÅäÖÃ", function() {
- var configValue = config.getConfig("demo_input_id");
- printl("setID·½·¨ÑÝʾ£º´Óconfig¶ÁÈ¡µ½Öµ \"" + configValue + "\"");
- });
- section3.addView(btn3);
- page.addView(section3);
-
- // ·½·¨4£ºsetDefultText - ÉèÖÃĬÈÏÎı¾
- var section4 = createMethodSection(
- "·½·¨4£ºsetDefultText",
- "ÉèÖÃÊäÈë¿òµÄĬÈÏÎı¾Öµ",
- "input.setDefultText(\"ĬÈÏÖµ\");"
- );
-
- var input4 = new Input();
- input4.setID("default_text_demo");
- input4.setDefultText("ÕâÊÇĬÈÏÎı¾");
- input4.setWidth(280);
- input4.setHeight(42);
- input4.setBackgroundColor(255, 255, 255);
- section4.addView(input4);
-
- var infoLabel4 = createInfoLabel("ÅäºÏsetIDʹÓ㬿Éͨ¹ýconfig±£´æ/¶ÁȡĬÈÏÖµ");
- section4.addView(infoLabel4);
- page.addView(section4);
-
- // Ìí¼Óµ½TabView
- tab.addView(0, page);
- printl("»ù´¡·½·¨Ò³Ãæ¹¹½¨Íê³É");
- }
- // =============================================================================
- // µÚ¶þÒ³£ºÑùʽÉèÖÃÑÝʾ
- // =============================================================================
- function buildStylePage() {
- var page = new Vertical();
- page.setSpacing(0);
- page.setBackgroundColor(250, 245, 245);
- // ·½·¨5£ºsetTextColor - Îı¾ÑÕÉ«
- var section5 = createMethodSection(
- "·½·¨5£ºsetTextColor",
- "ÉèÖÃÊäÈë¿òÎı¾ÑÕÉ« (R, G, B)",
- "input.setTextColor(255, 0, 0); // ºìÉ«"
- );
-
- var colorContainer = new Horizontal();
- colorContainer.setSpacing(10);
-
- var redInput = new Input();
- redInput.setText("ºìÉ«Îı¾");
- redInput.setTextColor(255, 0, 0);
- redInput.setWidth(85);
- redInput.setHeight(40);
- redInput.setBackgroundColor(255, 235, 235);
- colorContainer.addView(redInput);
-
- var greenInput = new Input();
- greenInput.setText("ÂÌÉ«Îı¾");
- greenInput.setTextColor(0, 150, 0);
- greenInput.setWidth(85);
- greenInput.setHeight(40);
- greenInput.setBackgroundColor(235, 255, 235);
- colorContainer.addView(greenInput);
-
- var blueInput = new Input();
- blueInput.setText("À¶É«Îı¾");
- blueInput.setTextColor(0, 100, 255);
- blueInput.setWidth(85);
- blueInput.setHeight(40);
- blueInput.setBackgroundColor(235, 235, 255);
- colorContainer.addView(blueInput);
-
- section5.addView(colorContainer);
- page.addView(section5);
-
- // ·½·¨6£ºsetFontSize - ×ÖÌå´óС
- var section6 = createMethodSection(
- "·½·¨6£ºsetFontSize",
- "ÉèÖÃÊäÈë¿ò×ÖÌå´óС",
- "input.setFontSize(18);"
- );
-
- var fontContainer = new Vertical();
- fontContainer.setSpacing(8);
-
- var smallInput = new Input();
- smallInput.setText("С×ÖÌå (12px)");
- smallInput.setFontSize(12);
- smallInput.setWidth(280);
- smallInput.setHeight(35);
- smallInput.setBackgroundColor(255, 255, 255);
- fontContainer.addView(smallInput);
-
- var mediumInput = new Input();
- mediumInput.setText("ÖÐ×ÖÌå (16px)");
- mediumInput.setFontSize(16);
- mediumInput.setWidth(280);
- mediumInput.setHeight(40);
- mediumInput.setBackgroundColor(255, 255, 255);
- fontContainer.addView(mediumInput);
-
- var largeInput = new Input();
- largeInput.setText("´ó×ÖÌå (20px)");
- largeInput.setFontSize(20);
- largeInput.setWidth(280);
- largeInput.setHeight(45);
- largeInput.setBackgroundColor(255, 255, 255);
- fontContainer.addView(largeInput);
-
- section6.addView(fontContainer);
- page.addView(section6);
-
- // ·½·¨7£ºsetBackgroundColor - ±³¾°ÑÕÉ«
- var section7 = createMethodSection(
- "·½·¨7£ºsetBackgroundColor",
- "ÉèÖÃÊäÈë¿ò±³¾°ÑÕÉ«",
- "input.setBackgroundColor(240, 240, 240);"
- );
-
- var bgContainer = new Horizontal();
- bgContainer.setSpacing(10);
-
- var yellowBg = new Input();
- yellowBg.setText("»ÆÉ«±³¾°");
- yellowBg.setWidth(85);
- yellowBg.setHeight(40);
- yellowBg.setBackgroundColor(255, 255, 200);
- bgContainer.addView(yellowBg);
-
- var cyanBg = new Input();
- cyanBg.setText("ÇàÉ«±³¾°");
- cyanBg.setWidth(85);
- cyanBg.setHeight(40);
- cyanBg.setBackgroundColor(200, 255, 255);
- bgContainer.addView(cyanBg);
-
- var pinkBg = new Input();
- pinkBg.setText("·ÛÉ«±³¾°");
- pinkBg.setWidth(85);
- pinkBg.setHeight(40);
- pinkBg.setBackgroundColor(255, 220, 230);
- bgContainer.addView(pinkBg);
-
- section7.addView(bgContainer);
- page.addView(section7);
-
- // ·½·¨8&9£ºsetWidth & setHeight - ³ß´çÉèÖÃ
- var section8 = createMethodSection(
- "·½·¨8&9£ºsetWidth & setHeight",
- "ÉèÖÃÊäÈë¿òµÄ¿í¶ÈºÍ¸ß¶È",
- "input.setWidth(300);\ninput.setHeight(50);"
- );
-
- var sizeContainer = new Vertical();
- sizeContainer.setSpacing(8);
-
- var smallSize = new Input();
- smallSize.setText("С³ß´ç (200x35)");
- smallSize.setWidth(200);
- smallSize.setHeight(35);
- smallSize.setBackgroundColor(255, 255, 255);
- sizeContainer.addView(smallSize);
-
- var mediumSize = new Input();
- mediumSize.setText("Öгߴç (250x42)");
- mediumSize.setWidth(250);
- mediumSize.setHeight(42);
- mediumSize.setBackgroundColor(255, 255, 255);
- sizeContainer.addView(mediumSize);
-
- var largeSize = new Input();
- largeSize.setText("´ó³ß´ç (300x50)");
- largeSize.setWidth(300);
- largeSize.setHeight(50);
- largeSize.setBackgroundColor(255, 255, 255);
- sizeContainer.addView(largeSize);
-
- section8.addView(sizeContainer);
- page.addView(section8);
-
- // Ìí¼Óµ½TabView
- tab.addView(1, page);
- printl("ÑùʽÉèÖÃÒ³Ãæ¹¹½¨Íê³É");
- }
- // =============================================================================
- // µÚÈýÒ³£º¸ß¼¶¹¦ÄÜÑÝʾ
- // =============================================================================
- function buildAdvancedPage() {
- var page = new Vertical();
- page.setSpacing(0);
- page.setBackgroundColor(245, 250, 245);
- // ·½·¨10£ºsetPlaceholder - ռλ·û
- var section10 = createMethodSection(
- "·½·¨10£ºsetPlaceholder",
- "ÉèÖÃռλÌáʾÎı¾£¨ÊäÈë¿òΪ¿ÕʱÏÔʾ£©",
- "input.setPlaceholder(\"ÇëÊäÈëÓû§Ãû...\");"
- );
-
- var placeholderInput = new Input();
- placeholderInput.setPlaceholder("ÕâÊÇÒ»¸öռλÌáʾÎı¾...");
- placeholderInput.setWidth(280);
- placeholderInput.setHeight(42);
- placeholderInput.setBackgroundColor(255, 255, 255);
- section10.addView(placeholderInput);
- page.addView(section10);
-
- // ·½·¨11£ºsetTextAlignment - Îı¾¶ÔÆë
- var section11 = createMethodSection(
- "·½·¨11£ºsetTextAlignment",
- "ÉèÖÃÎı¾¶ÔÆë·½Ê½ (left/center/right)",
- "input.setTextAlignment(\"center\");"
- );
-
- var alignContainer = new Vertical();
- alignContainer.setSpacing(8);
-
- var leftAlign = new Input();
- leftAlign.setText("×ó¶ÔÆë (left)");
- leftAlign.setTextAlignment("left");
- leftAlign.setWidth(280);
- leftAlign.setHeight(40);
- leftAlign.setBackgroundColor(255, 240, 240);
- alignContainer.addView(leftAlign);
-
- var centerAlign = new Input();
- centerAlign.setText("¾ÓÖÐ¶ÔÆë (center)");
- centerAlign.setTextAlignment("center");
- centerAlign.setWidth(280);
- centerAlign.setHeight(40);
- centerAlign.setBackgroundColor(240, 255, 240);
- alignContainer.addView(centerAlign);
-
- var rightAlign = new Input();
- rightAlign.setText("ÓÒ¶ÔÆë (right)");
- rightAlign.setTextAlignment("right");
- rightAlign.setWidth(280);
- rightAlign.setHeight(40);
- rightAlign.setBackgroundColor(240, 240, 255);
- alignContainer.addView(rightAlign);
-
- section11.addView(alignContainer);
- page.addView(section11);
-
- // ·½·¨12£ºsetInputStyle - ÊäÈë¿òÑùʽ
- var section12 = createMethodSection(
- "·½·¨12£ºsetInputStyle",
- "ÉèÖÃÊäÈë¿òÑùʽ (true=µ×²¿ÏßÌõÑùʽ)",
- "input.setInputStyle(true); // µ×²¿ÏßÌõÑùʽ"
- );
-
- var styleContainer = new Vertical();
- styleContainer.setSpacing(15);
-
- var normalStyle = new Input();
- normalStyle.setText("ÆÕͨÑùʽ (ĬÈÏ)");
- normalStyle.setWidth(280);
- normalStyle.setHeight(42);
- normalStyle.setBackgroundColor(255, 255, 255);
- styleContainer.addView(normalStyle);
-
- var lineStyle = new Input();
- lineStyle.setText("µ×²¿ÏßÌõÑùʽ");
- lineStyle.setInputStyle(true);
- lineStyle.setWidth(280);
- lineStyle.setHeight(42);
- styleContainer.addView(lineStyle);
-
- section12.addView(styleContainer);
- page.addView(section12);
-
- // ¶¯Ì¬ÑùʽÇл»ÑÝʾ
- var sectionDynamic = createMethodSection(
- "¶¯Ì¬ÑùʽÇл»",
- "ʵʱÐÞ¸ÄÊäÈë¿òµÄ¸÷ÖÖÊôÐÔ",
- "ͨ¹ý°´Å¥½»»¥¶¯Ì¬¸Ä±äÑùʽ"
- );
-
- var dynamicInput = new Input();
- dynamicInput.setText("¶¯Ì¬ÑùʽÊäÈë¿ò");
- dynamicInput.setWidth(280);
- dynamicInput.setHeight(45);
- dynamicInput.setBackgroundColor(255, 255, 255);
- sectionDynamic.addView(dynamicInput);
-
- var btnContainer = new Horizontal();
- btnContainer.setSpacing(8);
-
- var colorBtn = createSmallButton("񄐮", function() {
- var colors = [
- [255, 200, 200], [200, 255, 200], [200, 200, 255],
- [255, 255, 200], [255, 200, 255], [200, 255, 255]
- ];
- var randomColor = colors[Math.floor(Math.random() * colors.length)];
- dynamicInput.setBackgroundColor(randomColor[0], randomColor[1], randomColor[2]);
- printl("¶¯Ì¬Ñùʽ£º±³¾°É«Òѱä¸ü");
- });
- btnContainer.addView(colorBtn);
-
- var alignBtn = createSmallButton("Çл»¶ÔÆë", function() {
- var aligns = ["left", "center", "right"];
- var currentText = dynamicInput.getText();
- var currentAlign = "left";
- if (currentText.indexOf("¾ÓÖÐ") !== -1) currentAlign = "center";
- if (currentText.indexOf("ÓÒ¶ÔÆë") !== -1) currentAlign = "right";
-
- var nextIndex = (aligns.indexOf(currentAlign) + 1) % 3;
- var nextAlign = aligns[nextIndex];
-
- var alignLabels = { "left": "×ó¶ÔÆë", "center": "¾ÓÖÐ¶ÔÆë", "right": "ÓÒ¶ÔÆë" };
- dynamicInput.setText(alignLabels[nextAlign]);
- dynamicInput.setTextAlignment(nextAlign);
- printl("¶¯Ì¬Ñùʽ£º¶ÔÆë·½Ê½ÒÑÇл»Îª " + nextAlign);
- });
- btnContainer.addView(alignBtn);
-
- var sizeBtn = createSmallButton("µ÷Õû´óС", function() {
- var sizes = [[200, 35], [250, 42], [300, 50]];
- var currentWidth = dynamicInput.getWidth ? 250 : 250; // ĬÈÏÖгߴç
- var nextSize = sizes[Math.floor(Math.random() * sizes.length)];
- dynamicInput.setWidth(nextSize[0]);
- dynamicInput.setHeight(nextSize[1]);
- printl("¶¯Ì¬Ñùʽ£º³ß´çÒѵ÷ÕûΪ " + nextSize[0] + "x" + nextSize[1]);
- });
- btnContainer.addView(sizeBtn);
-
- sectionDynamic.addView(btnContainer);
- page.addView(sectionDynamic);
-
- // Ìí¼Óµ½TabView
- tab.addView(2, page);
- printl("¸ß¼¶¹¦ÄÜÒ³Ãæ¹¹½¨Íê³É");
- }
- // =============================================================================
- // µÚËÄÒ³£º×ÛºÏÓ¦ÓÃÑÝʾ
- // =============================================================================
- function buildApplicationPage() {
- var page = new Vertical();
- page.setSpacing(0);
- page.setBackgroundColor(250, 250, 245);
- // Ó¦Óó¡¾°1£ºµÇ¼±íµ¥
- var loginSection = createAppSection("³¡¾°1£ºÓû§µÇ¼±íµ¥");
-
- // Óû§ÃûÊäÈë
- var usernameLabel = new Label();
- usernameLabel.setText("Óû§Ãû:");
- usernameLabel.setFontSize(14);
- usernameLabel.setTextColor(60, 60, 60);
- loginSection.addView(usernameLabel);
-
- var usernameInput = new Input();
- usernameInput.setID("login_username");
- usernameInput.setPlaceholder("ÇëÊäÈëÓû§Ãû");
- usernameInput.setWidth(280);
- usernameInput.setHeight(42);
- usernameInput.setBackgroundColor(255, 255, 255);
- usernameInput.setTextColor(50, 50, 50);
- loginSection.addView(usernameInput);
-
- // ÃÜÂëÊäÈë
- var passwordLabel = new Label();
- passwordLabel.setText("ÃÜÂë:");
- passwordLabel.setFontSize(14);
- passwordLabel.setTextColor(60, 60, 60);
- loginSection.addView(passwordLabel);
-
- var passwordInput = new Input();
- passwordInput.setID("login_password");
- passwordInput.setPlaceholder("ÇëÊäÈëÃÜÂë");
- passwordInput.setWidth(280);
- passwordInput.setHeight(42);
- passwordInput.setBackgroundColor(255, 255, 255);
- passwordInput.setInputStyle(true); // ʹÓõײ¿ÏßÌõÑùʽ
- loginSection.addView(passwordInput);
-
- // µÇ¼½á¹û±êÇ©
- var loginResult = createResultLabel("µÈ´ý²Ù×÷...");
- loginSection.addView(loginResult);
-
- // °´Å¥ÇøÓò
- var loginBtnContainer = new Horizontal();
- loginBtnContainer.setSpacing(15);
-
- var loginBtn = createActionButton("怬", function() {
- var username = usernameInput.getText();
- var password = passwordInput.getText();
-
- if (username === "" || password === "") {
- loginResult.setText("❌ ÇëÌîдÍêÕûÐÅÏ¢£¡");
- loginResult.setTextColor(255, 0, 0);
- } else {
- loginResult.setText("✅ µÇ¼³É¹¦£¡»¶Ó " + username);
- loginResult.setTextColor(0, 150, 0);
- printl("µÇ¼ÑÝʾ£ºÓû§Ãû=" + username + ", ÃÜÂ볤¶È=" + password.length);
- }
- });
- loginBtnContainer.addView(loginBtn);
-
- var resetBtn = createSecondaryButton("ÖØÖÃ", function() {
- usernameInput.setText("");
- passwordInput.setText("");
- loginResult.setText("ÒÑÖØÖã¬ÇëÖØÐÂÊäÈë");
- loginResult.setTextColor(100, 100, 100);
- printl("µÇ¼ÑÝʾ£º±íµ¥ÒÑÖØÖÃ");
- });
- loginBtnContainer.addView(resetBtn);
-
- loginSection.addView(loginBtnContainer);
- page.addView(loginSection);
-
- // Ó¦Óó¡¾°2£º¸öÈËÐÅÏ¢±à¼
- var profileSection = createAppSection("³¡¾°2£º¸öÈËÐÅÏ¢±à¼");
-
- // êdzÆ
- var nicknameRow = createInputRow("êdzÆ", "nickname_field", "ÇëÊäÈëêdzÆ");
- profileSection.addView(nicknameRow);
-
- // ÓÊÏä
- var emailRow = createInputRow("ÓÊÏä", "email_field", "ÇëÊäÈëÓÊÏ䵨ַ");
- profileSection.addView(emailRow);
-
- // µç»°
- var phoneRow = createInputRow("µç»°", "phone_field", "ÇëÊäÈëµç»°ºÅÂë");
- profileSection.addView(phoneRow);
-
- // ±£´æ°´Å¥
- var saveBtn = createActionButton("±£´æÐÅÏ¢", function() {
- var nickname = config.getConfig("nickname_field");
- var email = config.getConfig("email_field");
- var phone = config.getConfig("phone_field");
-
- printl("±£´æÐÅÏ¢£ºêdzÆ=" + nickname + ", ÓÊÏä=" + email + ", µç»°=" + phone);
-
- var saveResult = createResultLabel("✅ ÐÅÏ¢Òѱ£´æµ½ÅäÖã¡");
- saveResult.setTextColor(0, 150, 0);
- profileSection.addView(saveResult);
-
- // 3ÃëºóÒÆ³ý½á¹ûÌáʾ
- sleep(3000);
- // ×¢Ò⣺ʵ¼ÊÓ¦ÓÃÖпÉÄÜÐèҪʹÓö¨Ê±Æ÷
- });
- profileSection.addView(saveBtn);
-
- page.addView(profileSection);
-
- // Ó¦Óó¡¾°3£ºËÑË÷¹¦ÄÜ
- var searchSection = createAppSection("³¡¾°3£ºËÑË÷¹¦ÄÜ");
-
- var searchContainer = new Horizontal();
- searchContainer.setSpacing(10);
-
- var searchInput = new Input();
- searchInput.setPlaceholder("ÇëÊäÈëËÑË÷¹Ø¼ü´Ê...");
- searchInput.setWidth(200);
- searchInput.setHeight(42);
- searchInput.setBackgroundColor(255, 255, 255);
- searchInput.setTextAlignment("left");
- searchContainer.addView(searchInput);
-
- var searchBtn = new Button();
- searchBtn.setText("🔍 ËÑË÷");
- searchBtn.setColor(0, 122, 255);
- searchBtn.setTextColor(255, 255, 255);
- searchBtn.setWidth(80);
- searchBtn.setHeight(42);
-
- var searchResult = createResultLabel("ÊäÈë¹Ø¼ü´Êºóµã»÷ËÑË÷");
-
- searchBtn.onClick(function() {
- var keyword = searchInput.getText();
- if (keyword === "") {
- searchResult.setText("⚠️ ÇëÊäÈëËÑË÷¹Ø¼ü´Ê");
- searchResult.setTextColor(255, 150, 0);
- } else {
- searchResult.setText("🔍 ÕýÔÚËÑË÷: \"" + keyword + "\"...");
- searchResult.setTextColor(0, 100, 200);
- printl("ËÑË÷ÑÝʾ£º¹Ø¼ü´Ê=\"" + keyword + "\"");
- }
- });
- searchContainer.addView(searchBtn);
-
- searchSection.addView(searchContainer);
- searchSection.addView(searchResult);
- page.addView(searchSection);
-
- // Ìí¼Óµ½TabView
- tab.addView(3, page);
- printl("×ÛºÏÓ¦ÓÃÒ³Ãæ¹¹½¨Íê³É");
- }
- // =============================================================================
- // µÚÎåÒ³£º¹ØÓÚÒ³Ãæ
- // =============================================================================
- function buildAboutPage() {
- var page = new Vertical();
- page.setSpacing(0);
- page.setBackgroundColor(240, 248, 255);
- page.setAlignment("center");
- // Ó¦ÓÃͼ±êÇøÓò£¨Ê¹ÓÃLabelÄ£Ä⣩
- var iconLabel = new Label();
- iconLabel.setText("⌨️");
- iconLabel.setFontSize(40);
- page.addView(iconLabel);
-
- // ±êÌâ
- var appTitle = new Label();
- appTitle.setText("Input¿Ø¼þϵͳ»¯Ê¾Àý");
- appTitle.setFontSize(22);
- appTitle.setTextColor(0, 100, 150);
- appTitle.setTextAlignment("center");
- page.addView(appTitle);
-
- // °æ±¾ÐÅÏ¢
- var versionLabel = new Label();
- versionLabel.setText("°æ±¾: 2.0.0");
- versionLabel.setFontSize(14);
- versionLabel.setTextColor(100, 100, 100);
- versionLabel.setTextAlignment("center");
- page.addView(versionLabel);
-
- // ·Ö¸ôÏß
- var line = new Label();
- line.setText("©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥");
- line.setTextAlignment("center");
- line.setTextColor(200, 200, 200);
- page.addView(line);
-
- // ·½·¨Áбí
- var methodListLabel = new Label();
- methodListLabel.setText("📋 Input¿Ø¼þ·½·¨Çåµ¥");
- methodListLabel.setFontSize(16);
- methodListLabel.setTextColor(50, 50, 50);
- methodListLabel.setTextAlignment("center");
- page.addView(methodListLabel);
-
- var methodsInfo = new Label();
- methodsInfo.setText(
- "1. setText(text) - ÉèÖÃÎı¾\n" +
- "2. getText() - »ñÈ¡Îı¾\n" +
- "3. setID(id) - ÉèÖÿؼþID\n" +
- "4. setDefultText(text) - ÉèÖÃĬÈÏÎı¾\n" +
- "5. setTextColor(r,g,b) - ÉèÖÃÎı¾ÑÕÉ«\n" +
- "6. setFontSize(size) - ÉèÖÃ×ÖÌå´óС\n" +
- "7. setBackgroundColor(r,g,b) - ÉèÖñ³¾°É«\n" +
- "8. setWidth(width) - ÉèÖÿí¶È\n" +
- "9. setHeight(height) - ÉèÖø߶È\n" +
- "10. setPlaceholder(text) - ÉèÖÃռλ·û\n" +
- "11. setTextAlignment(align) - ÉèÖÃ¶ÔÆë\n" +
- "12. setInputStyle(bool) - ÉèÖÃÑùʽ"
- );
- methodsInfo.setFontSize(11);
- methodsInfo.setTextColor(80, 80, 80);
- methodsInfo.setTextAlignment("left");
- methodsInfo.setBackgroundColor(255, 255, 255);
- methodsInfo.setWidth(300);
- methodsInfo.setHeight(180);
- page.addView(methodsInfo);
-
- // ·Ö¸ôÏß
- var line2 = new Label();
- line2.setText("©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥©¥");
- line2.setTextAlignment("center");
- line2.setTextColor(200, 200, 200);
- page.addView(line2);
-
-
- // Í˳ö°´Å¥
- var exitBtn = new Button();
- exitBtn.setText("Í˳öʾÀý");
- exitBtn.setColor(255, 59, 48);
- exitBtn.setTextColor(255, 255, 255);
- exitBtn.setWidth(150);
- exitBtn.setHeight(45);
- exitBtn.onClick(function() {
- printl("Óû§Í˳öʾÀý");
- tab.dismiss();
- });
- page.addView(exitBtn);
-
- // Ìí¼Óµ½TabView
- tab.addView(4, page);
- printl("¹ØÓÚÒ³Ãæ¹¹½¨Íê³É");
- }
- // =============================================================================
- // ¸¨Öúº¯Êý - UI×é¼þ´´½¨
- // =============================================================================
- // ´´½¨Õ½ڱêÌâ
- function createSectionTitle(text) {
- var title = new Label();
- title.setText(text);
- title.setFontSize(18);
- title.setTextColor(0, 100, 150);
- title.setTextAlignment("center");
- title.setWidth(350);
- title.setHeight(30);
- return title;
- }
- // ´´½¨·½·¨ÑÝÊ¾Çø¿é
- function createMethodSection(methodName, description, codeExample) {
- var section = new Vertical();
- section.setSpacing(0);
- section.setBackgroundColor(255, 255, 255);
-
- // ·½·¨Ãû³Æ
- var nameLabel = new Label();
- nameLabel.setText(methodName);
- nameLabel.setFontSize(15);
- nameLabel.setTextColor(0, 122, 255);
- nameLabel.setTextAlignment("left");
- section.addView(nameLabel);
-
- // ·½·¨ÃèÊö
- var descLabel = new Label();
- descLabel.setText(description);
- descLabel.setFontSize(12);
- descLabel.setTextColor(80, 80, 80);
- section.addView(descLabel);
-
- // ´úÂëʾÀý
- var codeLabel = new Label();
- codeLabel.setText(codeExample);
- codeLabel.setFontSize(11);
- codeLabel.setTextColor(50, 50, 150);
- codeLabel.setBackgroundColor(245, 245, 255);
- codeLabel.setWidth(280);
- codeLabel.setHeight(35);
- section.addView(codeLabel);
-
- return section;
- }
- // ´´½¨Ó¦Óó¡¾°Çø¿é
- function createAppSection(title) {
- var section = new Vertical();
- section.setSpacing(2);
- section.setBackgroundColor(255, 255, 255);
-
- var titleLabel = new Label();
- titleLabel.setText(title);
- titleLabel.setFontSize(16);
- titleLabel.setTextColor(80, 80, 80);
- section.addView(titleLabel);
-
- return section;
- }
- // ´´½¨ÊäÈëÐУ¨±êÇ©+ÊäÈë¿ò£©
- function createInputRow(labelText, inputId, placeholder) {
- var row = new Vertical();
- row.setSpacing(5);
-
- var label = new Label();
- label.setText(labelText + ":");
- label.setFontSize(13);
- label.setTextColor(60, 60, 60);
- row.addView(label);
-
- var input = new Input();
- input.setID(inputId);
- input.setPlaceholder(placeholder);
- input.setWidth(280);
- input.setHeight(40);
- input.setBackgroundColor(250, 250, 250);
- row.addView(input);
-
- return row;
- }
- // ´´½¨²Ù×÷°´Å¥
- function createActionButton(text, onClickHandler) {
- var btn = new Button();
- btn.setText(text);
- btn.setColor(0, 122, 255);
- btn.setTextColor(255, 255, 255);
- btn.setWidth(120);
- btn.setHeight(40);
- btn.onClick(onClickHandler);
- return btn;
- }
- // ´´½¨´ÎÒª°´Å¥
- function createSecondaryButton(text, onClickHandler) {
- var btn = new Button();
- btn.setText(text);
- btn.setColor(150, 150, 150);
- btn.setTextColor(255, 255, 255);
- btn.setWidth(100);
- btn.setHeight(40);
- btn.onClick(onClickHandler);
- return btn;
- }
- // ´´½¨Ð¡°´Å¥
- function createSmallButton(text, onClickHandler) {
- var btn = new Button();
- btn.setText(text);
- btn.setColor(100, 150, 200);
- btn.setTextColor(255, 255, 255);
- btn.setWidth(85);
- btn.setHeight(35);
- btn.onClick(onClickHandler);
- return btn;
- }
- // ´´½¨½á¹û±êÇ©
- function createResultLabel(text) {
- var label = new Label();
- label.setText(text);
- label.setFontSize(12);
- label.setTextColor(100, 100, 100);
- label.setBackgroundColor(245, 245, 245);
- label.setWidth(280);
- label.setHeight(30);
- return label;
- }
- // ´´½¨ÐÅÏ¢±êÇ©
- function createInfoLabel(text) {
- var label = new Label();
- label.setText(text);
- label.setFontSize(11);
- label.setTextColor(120, 120, 120);
- label.setTextAlignment("center");
- return label;
- }
- // =============================================================================
- // ³ÌÐòÈë¿Ú
- // =============================================================================
- printl("=== Input¿Ø¼þÈ«ÐÂϵͳ»¯Ê¾ÀýÒÑÆô¶¯ ===");
- printl("±¾Ê¾Àý°üº¬5¸öTabÒ³Ãæ£¬È«ÃæÕ¹Ê¾Input¿Ø¼þµÄ12¸ö·½·¨");
¸´ÖÆ´úÂë
|
|