列表组件以调出 InputText 框

Posted 2023-04-18

【中文标题】列表组件以调出 InputText 框

【英文标题】：List component to bring up InputText boxes

【发布时间】：2012-10-19 05:59:43

【问题描述】：

我正在创建一个列表组件，每个标签上都有不同的数字，范围从 1 到 10。当单击一个数字时，我需要它来一个接一个地显示那么多输入文本框..

这几乎是一个多人游戏，你选择有多少玩家在玩，然后输入每个玩家的名字.. 我被卡住了，这太荒谬了.. 如果有人有解决方案或不同的想法，请帮助我，谢谢提前这么多。

【参考方案1】：

有很多方法可以做到这一点。

Flash 专业方法

在 Flash Professional 的画板上创作您的观点。

包括一个列表控件，以及你想要显示的文本框，例如：

为您的组件指定属性名称，例如列表的quantityList 以及答案文本输入控件，例如answerBoxes 自定义符号内的answer1。

在代码中，您可以通过将其添加到时间线来控制答案视图的可见性：

import flash.events.Event;

quantityList.addItem(label:"1", data:1);
quantityList.addItem(label:"2", data:2);
quantityList.addItem(label:"3", data:3);
quantityList.addItem(label:"4", data:4);
quantityList.addItem(label:"5", data:5);
quantityList.addItem(label:"6", data:6);
quantityList.addItem(label:"7", data:7);
quantityList.addItem(label:"8", data:8);
quantityList.addItem(label:"9", data:9);
quantityList.addItem(label:"10", data:10);

quantityList.addEventListener(Event.CHANGE, changeHandler);

function changeHandler(event:Event):void

    var numberOfQuestions = event.target.selectedItem.data as int;

    answerBoxes.answer1.visible = (numberOfQuestions > 0 ? true : false);
    answerBoxes.answer2.visible = (numberOfQuestions > 1 ? true : false);
    answerBoxes.answer3.visible = (numberOfQuestions > 2 ? true : false);
    answerBoxes.answer4.visible = (numberOfQuestions > 3 ? true : false);
    answerBoxes.answer5.visible = (numberOfQuestions > 4 ? true : false);
    answerBoxes.answer6.visible = (numberOfQuestions > 5 ? true : false);
    answerBoxes.answer7.visible = (numberOfQuestions > 6 ? true : false);
    answerBoxes.answer8.visible = (numberOfQuestions > 7 ? true : false);
    answerBoxes.answer9.visible = (numberOfQuestions > 8 ? true : false);
    answerBoxes.answer10.visible = (numberOfQuestions > 9 ? true : false);

运行时，可以从列表中选择项目：

Working SWF Example

Flash Pro CS5.5 FLA source code

Flex - 一种程序化方法

将数量值存储在列表数据提供程序中，并在更改时迭代添加元素：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx">
    <s:layout>
        <s:HorizontalLayout />
    </s:layout>

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;

            import spark.components.TextInput;
            import spark.events.IndexChangeEvent;

            protected function quantityList_changeHandler(event:IndexChangeEvent):void
            
                textInputGroup.removeAllElements();

                for (var i:uint = 0; i < quantityList.selectedItem; i++)
                
                    textInputGroup.addElement(new TextInput());
                
            
        ]]>
    </fx:Script>

    <s:List id="quantityList"
            change="quantityList_changeHandler(event)"
            dataProvider="new ArrayList([1, 2, 3, 4, 5, 6, 7, 8, 9, 10])" />

    <s:VGroup id="textInputGroup" />


</s:Application>

Flex - 一种声明式方法

使用 Flex 状态系统，您可以声明式地布局您的视图，然后将组件包含在所需的状态中。您还可以在动画状态之间合并转换。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx">
    <s:layout>
        <s:HorizontalLayout />
    </s:layout>

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;

            import spark.components.TextInput;
            import spark.events.IndexChangeEvent;

            protected function quantityList_changeHandler(event:IndexChangeEvent):void
            
                currentState = "quantity" + quantityList.selectedItem.toString();
            
        ]]>
    </fx:Script>

    <s:states>
        <s:State name="quantity1" />
        <s:State name="quantity2" />
        <s:State name="quantity3" />
        <s:State name="quantity4" />
        <s:State name="quantity5" />
        <s:State name="quantity6" />
        <s:State name="quantity7" />
        <s:State name="quantity8" />
        <s:State name="quantity9" />
        <s:State name="quantity10" />
    </s:states>

    <s:List id="quantityList"
            change="quantityList_changeHandler(event)"
            dataProvider="new ArrayList([1, 2, 3, 4, 5, 6, 7, 8, 9, 10])" />

    <s:VGroup id="textInputGroup">
        <s:TextInput includeIn="quantity1,quantity2,quantity3,quantity4,quantity5,quantity6,quantity7,quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity2,quantity3,quantity4,quantity5,quantity6,quantity7,quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity3,quantity4,quantity5,quantity6,quantity7,quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity4,quantity5,quantity6,quantity7,quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity5,quantity6,quantity7,quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity6,quantity7,quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity7,quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity8,quantity9,quantity10" />
        <s:TextInput includeIn="quantity9,quantity10" />
        <s:TextInput includeIn="quantity10" />
    </s:VGroup>

</s:Application>

【讨论】：

伙计，我对此很陌生，我不知道如何在 actionscript 中使用这些东西..我什至说这听起来可能很无知，因为我确定它不是 AS.. 谢谢到目前为止你的帮助..

哦，你想要一个 Flash Pro list control 示例。抱歉，与从您的列表中侦听Event.CHANGE 的程序化方法基本相同。我会尽快添加该示例。

老兄，非常感谢你，我会想办法在这个网站上提高我的声誉，这样我就可以投票给你的答案了.. 非常感谢..

已更新，包括link to the FLA source code。

谢谢你帮助我。我还有一个问题，我会让你一个人呆着。 PFPDEV 有一个名为“喝酒游戏”的安卓应用程序。有一个多人游戏提示，询问有多少玩家，然后会弹出很多文本输入框让他们输入他们的名字。我想要做的基本上是......提交他们的名字后，我希望在顶部有一个文本框，以逐帧显示每个名字。反正你有时间帮我吗？另外，你有paypal吗？当我知道我的朋友至少会购买它时，我想补偿你。