ビンゴアプリで、「配列の中の数字をシャッフル」「ボタンクリックで配列の先頭から順に取得する（今何番目かも保持）」が実装できず困っております。

先日、以下の質問をした者です。
https://teratail.com/questions/245564?whotofollow=

この質問の続きで、新たに途中で詰まってしまったので、質問させていただきました。

前提・実現したいこと

ビンゴアプリを作成中で、以下の【手順】の（1）、（２）を実装したいです。
※イメージ写真は0-99までの数字ですが、今回は1-50までの数字での作成を試みています。

【手順】
(1) 1 - 50 の数字をシャッフルして配列を作り保存しておく。保存には Session とか ViewState などを使う。

(2) 最初のボタンクリックで配列の先頭から、次のクリックでその次から順に数字を配列から取得する。今何番目かも Session とか ViewState に保持する。

該当のソースコード

VisualBasic
1※マスターページです。こちらのファイルは作成後何も変更しておりません。
2<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="Site1.master.vb" Inherits="bingo.Site1" %>
3
4<!DOCTYPE html>
5
6<html>
7<head runat="server">
8<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
9    <title></title>
10    <asp:ContentPlaceHolder ID="head" runat="server">
11    </asp:ContentPlaceHolder>
12</head>
13<body>
14    <form id="form1" runat="server">
15        <div>
16            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
17            </asp:ContentPlaceHolder>
18        </div>
19    </form>
20</body>
21</html>

VisualBasic
1※マスターページを含むWebフォームです。（top.aspx）
2<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site1.Master" CodeBehind="top.aspx.vb" Inherits="bingo.top" %>
3<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
4    <link rel="stylesheet" type="text/css" href="../CSS/top.css">
5</asp:Content>
6<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
7    <div class="parent_container">
8        <div class="left_container">
9            <div class="number_wrap">
10                <div><asp:Label ID="Label1" runat="server" Text="1" CssClass="num"></asp:Label></div>
11                <div><asp:Label ID="Label2" runat="server" Text="2" CssClass="num"></asp:Label></div>
12                <div><asp:Label ID="Label3" runat="server" Text="3" CssClass="num"></asp:Label></div>
13                <div><asp:Label ID="Label4" runat="server" Text="4" CssClass="num"></asp:Label></div>
14                <div><asp:Label ID="Label5" runat="server" Text="5" CssClass="num"></asp:Label></div>
15                <div><asp:Label ID="Label6" runat="server" Text="6" CssClass="num"></asp:Label></div>
16                <div><asp:Label ID="Label7" runat="server" Text="7" CssClass="num"></asp:Label></div>
17                <div><asp:Label ID="Label8" runat="server" Text="8" CssClass="num"></asp:Label></div>
18                <div><asp:Label ID="Label9" runat="server" Text="9" CssClass="num"></asp:Label></div>
19                <div><asp:Label ID="Label10" runat="server" Text="10" CssClass="num"></asp:Label></div>
20                <div><asp:Label ID="Label11" runat="server" Text="11" CssClass="num"></asp:Label></div>
21                <div><asp:Label ID="Label12" runat="server" Text="12" CssClass="num"></asp:Label></div>
22                <div><asp:Label ID="Label13" runat="server" Text="13" CssClass="num"></asp:Label></div>
23                <div><asp:Label ID="Label14" runat="server" Text="14" CssClass="num"></asp:Label></div>
24                <div><asp:Label ID="Label15" runat="server" Text="15" CssClass="num"></asp:Label></div>
25                <div><asp:Label ID="Label16" runat="server" Text="16" CssClass="num"></asp:Label></div>
26                <div><asp:Label ID="Label17" runat="server" Text="17" CssClass="num"></asp:Label></div>
27                <div><asp:Label ID="Label18" runat="server" Text="18" CssClass="num"></asp:Label></div>
28                <div><asp:Label ID="Label19" runat="server" Text="19" CssClass="num"></asp:Label></div>
29                <div><asp:Label ID="Label20" runat="server" Text="20" CssClass="num"></asp:Label></div>
30                <div><asp:Label ID="Label21" runat="server" Text="21" CssClass="num"></asp:Label></div>
31                <div><asp:Label ID="Label22" runat="server" Text="22" CssClass="num"></asp:Label></div>
32                <div><asp:Label ID="Label23" runat="server" Text="23" CssClass="num"></asp:Label></div>
33                <div><asp:Label ID="Label24" runat="server" Text="24" CssClass="num"></asp:Label></div>
34                <div><asp:Label ID="Label25" runat="server" Text="25" CssClass="num"></asp:Label></div>
35                <div><asp:Label ID="Label26" runat="server" Text="26" CssClass="num"></asp:Label></div>
36                <div><asp:Label ID="Label27" runat="server" Text="27" CssClass="num"></asp:Label></div>
37                <div><asp:Label ID="Label28" runat="server" Text="28" CssClass="num"></asp:Label></div>
38                <div><asp:Label ID="Label29" runat="server" Text="29" CssClass="num"></asp:Label></div>
39                <div><asp:Label ID="Label30" runat="server" Text="30" CssClass="num"></asp:Label></div>
40                <div><asp:Label ID="Label31" runat="server" Text="31" CssClass="num"></asp:Label></div>
41                <div><asp:Label ID="Label32" runat="server" Text="32" CssClass="num"></asp:Label></div>
42                <div><asp:Label ID="Label33" runat="server" Text="33" CssClass="num"></asp:Label></div>
43                <div><asp:Label ID="Label34" runat="server" Text="34" CssClass="num"></asp:Label></div>
44                <div><asp:Label ID="Label35" runat="server" Text="35" CssClass="num"></asp:Label></div>
45                <div><asp:Label ID="Label36" runat="server" Text="36" CssClass="num"></asp:Label></div>
46                <div><asp:Label ID="Label37" runat="server" Text="37" CssClass="num"></asp:Label></div>
47                <div><asp:Label ID="Label38" runat="server" Text="38" CssClass="num"></asp:Label></div>
48                <div><asp:Label ID="Label39" runat="server" Text="39" CssClass="num"></asp:Label></div>
49                <div><asp:Label ID="Label40" runat="server" Text="40" CssClass="num"></asp:Label></div>
50                <div><asp:Label ID="Label41" runat="server" Text="41" CssClass="num"></asp:Label></div>
51                <div><asp:Label ID="Label42" runat="server" Text="42" CssClass="num"></asp:Label></div>
52                <div><asp:Label ID="Label43" runat="server" Text="43" CssClass="num"></asp:Label></div>
53                <div><asp:Label ID="Label44" runat="server" Text="44" CssClass="num"></asp:Label></div>
54                <div><asp:Label ID="Label45" runat="server" Text="45" CssClass="num"></asp:Label></div>
55                <div><asp:Label ID="Label46" runat="server" Text="46" CssClass="num"></asp:Label></div>
56                <div><asp:Label ID="Label47" runat="server" Text="47" CssClass="num"></asp:Label></div>
57                <div><asp:Label ID="Label48" runat="server" Text="48" CssClass="num"></asp:Label></div>
58                <div><asp:Label ID="Label49" runat="server" Text="49" CssClass="num"></asp:Label></div>
59                <div><asp:Label ID="Label50" runat="server" Text="50" CssClass="num"></asp:Label></div>
60            </div>
61
62        </div>
63        <div class="right_container">
64            <div class="num_result_container">
65                <asp:Label ID="num_result" runat="server" Text="今回の番号は..."></asp:Label>
66            </div>
67            <div class="button_container">
68                <asp:Button ID="Button1" runat="server" Text="抽選ボタン" CssClass="button" />
69            </div>
70        </div>
71    </div>
72</asp:Content>

VisualBasic
1※vbファイルです。（top.aspx.vb）
2Public Class top
3    Inherits System.Web.UI.Page
4    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
5
6    End Sub
7
8    Private Sub readyArray()
9        Session("Numbers") = New Integer() {0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50}
10        Dim Numbers As Integer() = Session("Numbers")
11        Dim rnd As New Random()
12
13        '配列のシャッフル
14        Dim n As Integer = 50
15        While n > 1
16            n -= 1
17            Dim k As Integer = Rnd.Next(n + 1)
18            Dim tmp As Integer = Numbers(k)
19            Numbers(k) = Numbers(n)
20            Numbers(n) = tmp
21        End While
22
23        'シャッフル後の配列を再びセッションに保存
24        Session("Numbers") = Numbers
25    End Sub
26
27    Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
28        Dim Numbers As Integer() = Session("Numbers")
29        Dim result As Integer() = Numbers.Take(1)
30
31        For i = 1 To 50
32            If i == result Then
33
34            End If
35        Next
36    End Sub
37End Class

試したこと

※以前、質問させていただいた際、以下の手順で作ることをアドバイスいただいております。
https://teratail.com/questions/244699?whotofollow=

【手順】
(1) 1 - 50 の数字をシャッフルして配列を作り保存しておく。web アプリはステートレスであることをお忘れなく。保存には Session とか ViewState などを使う必要があります。

(2) 最初のボタンクリックで配列の先頭から、次のクリックでその次から順に数字を配列から取得する。今何番目かも Session とか ViewState に保持する必要があります。

(3) 上記 (2) で取得した数字に該当する Label の色を変える (CssClass とか ForeColor を変える)。

(4) 上記 (2) で保存した「何番目」が配列の最後になるまで繰り返す。

上記の手順をもとに、調べたりしながら進めてみましたが、ネットで調べたものを継ぎ接ぎ的に実装しているため、めちゃくちゃであるという指摘をいただきました。
今回の質問で、（1）（2）まで解決できればと思います。
よろしくお願いいたします。

※もし可能なら具体的なコードを交えて解説いただければ助かります。

補足情報（FW/ツールのバージョンなど）

統合開発環境
Visual Studio2019
（言語：VB.NET、プロジェクトテンプレート：ASP.NET Webアプリケーション）

使用PC
Windows10

※平日は仕事のため、返信が19:30以降になります。
どうぞよろしくお願いします。

行動規範の内容に同意します

回答1件

ベストアンサー

基本的なやり方だけですが、以下に書いておきます。コーディングは質問者さんの自助努力でお願いします。

Public Class top
    Inherits System.Web.UI.Page
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If (初期画面であれば ← IsPostBack で判定）
            (1) 1 - 50 の整数の配列を作る
            (2) 配列をシャッフルする
            (3) シャッフルした配列を Session に保存
            (4) 配列の Index を Session に保存。初期値は配列の先頭 Index - 1
        End If
    End Sub

    Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
       　(1) Session からシャッフルされた配列を取り出す
         (2) Session から Index を取り出す
         (3) Index を 1 インクレメント
         If (Index が配列の末尾を超えていなければ）
             (4) Label (num_result) の Text に Index が指す配列の値を書き込む
             (5) "Labal" & Index が指す配列の値 という文字列を作る
             (6) FindControl の引数に上記 (5) の文字列を代入し当該 Label を見つける
             (7) 見つけた Label の ForeColor プロパティで色を変える
             (8) Index を Session に保存する
          End IF
    End Sub
End Class

Session に値がなかった時のエラー処置とか、Session から値を取りだしたときのキャストとか、FindControl で見つけるやり方とか、FindControl で見つからなかった時のエラー処置など、細かいことは質問者さんの方で考えてみてください。

投稿2020/03/07 05:16

編集2020/03/07 05:43

退会済みユーザー

総合スコア0

Eltk

2020/03/07 06:56

詳しく流れを教えてくださり、ありがとうございます。今、流れに沿って実装中です。一つ、質問なのですが、「(5) "Labal" & Index が指す配列の値という文字列を作る」この部分のイメージがわかず、理解できませんでした。（イメージがわかないため）・文字列は不定の変数のようなものなのか・文字列を作るのはどの場所か・FindControlの引数となるとのことなので、ID名のことかなと思っているのですが、新しいLabelを作るということなのかなどが特にわかっていません。何度も申し訳ないです。教えていただけませんでしょうか。

退会済みユーザー

2020/03/07 07:20

FindControl の引数にするのだから作る文字列は探す Label の ID に決まってます。

Eltk

2020/03/07 14:32

返信が遅くなりすみません。時間がかかりましたが、なんとか実装できました。 4回に渡り、何度も教えていただき、ありがとうございました。

行動規範の内容に同意します