手順 3: 各ラベルへのランダムなアイコンの割り当てStep 3: Assign a random icon to each label

ゲームで毎回、同じアイコンが同じセルに表示されていたのでは、やりがいがありません。If the icons show up in the same cells every game, it's not very challenging. これを避けるには、AssignIconsToSquares() メソッドを使用して、フォームのラベル コントロールにアイコンをランダムに割り当てます。To avoid this, assign the icons randomly to the Label controls on your form by using an AssignIconsToSquares() method.

各ラベルにランダムなアイコンを割り当てるにはTo assign a random icon to each label

  1. 次のコードを追加する前に、メソッドのしくみについて検討します。Before adding the following code, consider how the method works. 新しいキーワード foreach (Visual C# の場合) および For Each (Visual Basic の場合) があります There's a new keyword: foreach in Visual C# and For Each in Visual Basic. (1 つの行は意図的にコメント アウトされています。これについてはこの手順の最後に説明します)。(One of the lines is commented out on purpose, which is explained at the end of this procedure.)

    /// <summary>
    /// Assign each icon from the list of icons to a random square
    /// </summary>
    private void AssignIconsToSquares()
    {
        // The TableLayoutPanel has 16 labels,
        // and the icon list has 16 icons,
        // so an icon is pulled at random from the list
        // and added to each label
        foreach (Control control in tableLayoutPanel1.Controls)
        {
            Label iconLabel = control as Label;
            if (iconLabel != null)
            {
                int randomNumber = random.Next(icons.Count);
                iconLabel.Text = icons[randomNumber];
                // iconLabel.ForeColor = iconLabel.BackColor;
                icons.RemoveAt(randomNumber);
            }
        }
    } 
    
    ''' <summary>
    ''' Assign each icon from the list of icons to a random square
    ''' </summary>
    ''' <remarks></remarks>
    Private Sub AssignIconsToSquares()
    
        ' The TableLayoutPanel has 16 labels,
        ' and the icon list has 16 icons,
        ' so an icon is pulled at random from the list
        ' and added to each label
        For Each control In TableLayoutPanel1.Controls
            Dim iconLabel = TryCast(control, Label)
            If iconLabel IsNot Nothing Then
                Dim randomNumber = random.Next(icons.Count)
                iconLabel.Text = icons(randomNumber)
                ' iconLabel.ForeColor = iconLabel.BackColor
                icons.RemoveAt(randomNumber)
            End If
        Next
    
    End Sub
    
  2. 前の手順で示されているように、AssignIconsToSquares() メソッドを追加します。Add the AssignIconsToSquares() method as shown in the previous step. このメソッドを、「手順 2: Random オブジェクトおよびアイコンのリストの追加」で追加したコードのすぐ下に配置できます。You can put it just below the code you added in Step 2: Add a Random object and a list of icons.

    前に説明したように、AssignIconsToSquares() メソッドに新しいものが含まれています。つまり、foreach ループ (Visual C# の場合) および For Each (Visual Basic の場合) です。As mentioned earlier, there's something new in your AssignIconsToSquares() method: a foreach loop in Visual C# and For Each in Visual Basic. For Each ループは、同じ処理を繰り返し実行する必要がある場合にいつでも使用できます。You can use a For Each loop any time you want to do the same action multiple times. ここでは、次のコードで説明されているように、TableLayoutPanel のラベルごとに同じステートメントを実行する必要があります。In this case, you want to execute the same statements for every label on your TableLayoutPanel, as explained by the following code. 最初の行では、control という名前の変数を作成し、その変数に一度に 1 つずつコントロールを格納して、そのコントロールに対してループ内のステートメントを実行します。The first line creates a variable named control that stores each control one at a time while that control has the statements in the loop executed on it.

    foreach (Control control in tableLayoutPanel1.Controls)
    {
        // The statements you want to execute 
        // for each label go here
        // The statements use iconLabel to access 
        // each label's properties and methods
    }
    
    For Each control In TableLayoutPanel1.Controls
        ' The statements you want to execute 
        ' for each label go here
        ' The statements use iconLabel to access 
        ' each label's properties and methods
    Next
    

    注意

    "iconLabel" および "control" という名前が使用されているのは、わかりやすくするためです。The names "iconLabel" and "control" are used because they are descriptive. これらの名前を任意の名前に置き換えても、コードはまったく同じように動作します (ただしループ内の各ステートメントで名前を変更する必要はあります)。You can replace these names with any names, and the code will work exactly the same as long as you change the name in each statement inside the loop.

    AssignIconsToSquares() メソッドは、TableLayoutPanel の各ラベル コントロールを反復処理し、それぞれに対し同じステートメントを実行します。The AssignIconsToSquares() method iterates through each label control in the TableLayoutPanel and executes the same statements for each of them. これらのステートメントは、「手順 2: Random オブジェクトおよびアイコンのリストの追加」からランダムなアイコンを取得します。Those statements pull a random icon from the list that you added in Step 2: Add a Random object and a list of icons. (リストに各アイコンを 2 つずつ含め、ランダムなラベル コントロールにアイコンのペアが割り当てられるようにしたのはこのためです)。(That's why you included two of each icon in the list, so there would be a pair of icons assigned to random Label controls.)

    foreach または For Each ループ内で実行されるコードを詳しく見てみましょう。Look more closely at the code that runs inside the foreach or For Each loop. 次に示しているのは前に示したコードの一部です。This code is reproduced here.

    Label iconLabel = control as Label;
    if (iconLabel != null)
    {
        int randomNumber = random.Next(icons.Count);
        iconLabel.Text = icons[randomNumber];
        // iconLabel.ForeColor = iconLabel.BackColor;
        icons.RemoveAt(randomNumber);
    }
    
    Dim iconLabel = TryCast(control, Label)
    If iconLabel IsNot Nothing Then
        Dim randomNumber = random.Next(icons.Count)
        iconLabel.Text = icons(randomNumber)
        ' iconLabel.ForeColor = iconLabel.BackColor
        icons.RemoveAt(randomNumber)
    End If
    

    最初の行では、control 変数を iconLabel という名前のラベルに変換しています。The first line converts the control variable to a label named iconLabel. その次の行は、変換が成功したかどうかを確認する if ステートメントです。The line after that is an if statement that checks to make sure the conversion worked. 変換が成功した場合は、if ステートメント内のステートメントが実行されます If the conversion does work, the statements in the if statement run. (前のチュートリアルでも説明したように、if ステートメントは、指定した任意の条件を評価するために使用されます)。if ステートメントの最初の行では、randomNumber という名前の変数を作成し、icons リスト内の項目のいずれかに対応する乱数をこの変数に格納します。(As you may recall from the previous tutorials, the if statement is used to evaluate whatever condition you specify.) The first line in the if statement creates a variable named randomNumber that contains a random number that corresponds to one of the items in the icons list. そのために、前に作成した Next() オブジェクトの Random メソッドを使用します。To do this, it uses the Next() method of the Random object that you created earlier. Next メソッドは乱数を返します。The Next method returns the random number. またこの行では、icons リストの Count プロパティを使用して、乱数を選択する範囲を決定しています。This line also uses the Count property of the icons list to determine the range from which to choose the random number. 次の行では、icons リストのいずれかの項目をラベルの Text プロパティに割り当てています。The next line assigns one of the icon list items to the Text property of the label. コメントアウトしている行は、このトピックの後半で説明します。The commented-out line is explained later in this topic. 最後に、if ステートメントの最終の行で、フォームに追加したアイコンをリストから削除しています。Finally, the last line in the if statement removes from the list the icon that has been added to the form.

    コード内にわからない部分があれば、コード要素の上にマウス ポインターを合わせると、関連するヒントが表示されます。Remember, if you're not sure about what some part of the code does, you can position the mouse pointer over a code element and review the resulting tooltip. Visual Studio デバッガーを使用して、プログラムの実行中にコードの各行をステップ実行することもできます。You can also step through each line of code while the program is running by using the Visual Studio debugger. 詳しくは、「How Do I: Step with The Debugger in Visual Studio?」 (操作方法: Visual Studio のデバッガーでステップ実行する) または「デバッガーでのコード間の移動」をご覧ください。See How do I: Step with The debugger in Visual Studio? or Navigate through code with the debugger for more information.

  3. ゲーム ボードをアイコンで埋めるには、プログラムが起動したらすぐに AssignIconsToSquares() メソッドを呼び出す必要があります。To fill up the game board with icons, you need to call the AssignIconsToSquares() method as soon as the program starts. Visual C# を使用している場合は、Form1constructorInitializeComponent() メソッドの呼び出しのすぐ下にステートメントを追加し、フォームが新しいメソッドを呼び出してフォーム自体の設定後に表示されるようにします。If you're using Visual C#, add a statement just below the call to the InitializeComponent() method in the Form1constructor, so your form calls your new method to set itself up before it's shown. 新しいオブジェクト (クラスや構造体など) を作成するときは、コンストラクターを呼び出します。Constructors are called when you create a new object, such as a class or struct. 詳しくは、「コンストラクター (C# プログラミング ガイド)」または「コンストラクターとデストラクターの使用方法」(Visual Basic の場合) をご覧ください。See Constructors (C# programming guide) or Use constructors and destructors in Visual Basic for more information.

    public Form1()
    {
        InitializeComponent();
    
        AssignIconsToSquares();
    }
    

    Visual Basic の場合は、AssignIconsToSquares() メソッドの呼び出しを Form1_Load メソッドに追加します。コードは次のようになります。For Visual Basic, add the AssignIconsToSquares() method call to the Form1_Load method so that the code looks like the following.

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        AssignIconsToSquares()
    End Sub
    
  4. プログラムを保存し、実行します。Save your program and run it. 各ラベルに割り当てられたランダムなアイコンを備えたフォームが表示されます。It should show a form with random icons assigned to each label.

  5. いったんプログラムを終了して、再び実行します。Close your program, and then run it again. 次の図に示すように、各ラベルに別のアイコンが割り当てられています。Notice that different icons are assigned to each label, as shown in the following picture.

    ランダムなアイコンが表示された [マッチング ゲーム] ランダムなアイコンが表示された [マッチング ゲーム]Matching game with random icons Matching game with random icons

    アイコンは、まだ非表示に設定されていないため、表示されています。The icons are visible now because you haven't hidden them. アイコンをプレーヤーに非表示にするには、各ラベルの ForeColor プロパティをその BackColor プロパティと同じ色に設定できます。To hide them from the player, you can set each label's ForeColor property to the same color as its BackColor property.

    ヒント

    ラベルのようなコントロールを非表示にする別の方法は、Visible プロパティを False に設定することです。Another way to hide controls like labels is to set their Visible property to False.

  6. アイコンを非表示にするには、プログラムを停止し、For Each ループ内のコードのコメント行からコメント記号を削除します。To hide the icons, stop the program and remove the comment marks for the commented line of code inside the For Each loop.

    iconLabel.ForeColor = iconLabel.BackColor;
    
    iconLabel.ForeColor = iconLabel.BackColor
    
  7. メニュー バーで、[すべて保存] をクリックし、プログラムを保存したうえで実行します。On the menu bar, choose the Save All button to save your program, and then run it. アイコンが非表示になったように見えます。青い背景のみが表示されます。The icons seem to have disappeared—only a blue background appears. ただし、アイコンはランダムに割り当てられて、そこに存在しています。However, the icons are randomly assigned and are still there. アイコンは、背景と同じ色であるため、プレーヤーには見えなくなっています。Because the icons are the same color as the background, it hides them from the player. これで、ゲームはやりがいのあるものになりました。プレーヤーはすべてのアイコンをすぐに見ることができなくなったためです。After all, it wouldn't be a very challenging game if the player could see all of the icons right away!

続行または確認するにはTo continue or review