how to display the selected number of items from the list in flex 4.6

Question

I am having a list which contains 20 items and I am having 4 buttons which are button1, button2, button3 and button4. Now I would like to display the first 5 items of the list when I click on the button1 and the second 5 items when I click on the button2 and so on,, How to do this? could anyone help me?

<s:List id="list" visible="true" height="105" x="100" y="100">
    <s:dataProvider>
        <s:ArrayCollection>
            <fx:String>1</fx:String>
            <fx:String>2</fx:String>
            <fx:String>3</fx:String>
            <fx:String>4</fx:String>
            <fx:String>5</fx:String>
            <fx:String>6</fx:String>
            <fx:String>7</fx:String>
            <fx:String>8</fx:String>
            <fx:String>9</fx:String>
            <fx:String>10</fx:String>
            <fx:String>11</fx:String>
            <fx:String>12</fx:String>               
            <fx:String>13</fx:String>
            <fx:String>14</fx:String>
            <fx:String>15</fx:String>
            <fx:String>16</fx:String>
            <fx:String>17</fx:String>
            <fx:String>18</fx:String>
            <fx:String>19</fx:String>
            <fx:String>20</fx:String>
        </s:ArrayCollection>
    </s:dataProvider>
</s:List>

Answer 1

Create a filterFunction for your ArrayCollection