カードを描画

格子状にカードを並べた画像から Sprite を切り分けて描画します。
Java Applet で 神経衰弱ゲーム が楽しめます。

前田稔(Maeda Minoru)の超初心者のプログラム入門

カードを描画

  1. カードゲームとは、トランプや花札のように、カードを使って遊ぶゲームです。
    カードではありませんが、マージャンもこの範疇です。
    多くの場合カードは、格子状に並べた大きな画像から切り分けて描画します。
    カードを切り出す Card Class を使って、カードを描画してみましょう。
    事前に @"c:\data\test\hanafuda.gif" を格納しておいて下さい。
    画像は JAVA ページの CARD Class で画像を切り分ける に掲載しています。
    トランプの画像は ペアのカードを取り除く です。
    /************************************************/
    /*★ Card Class で画像を切り分ける    前田 稔 ★*/
    /************************************************/
    using System;
    using System.Drawing;
    using System.Windows.Forms;
    
    public class MyForm : Form
    {
        Card    App;
        int     num;
    
        public MyForm()
        {
            App = new Card(@"c:\data\test\hanafuda.gif",51,75);
            Paint += new PaintEventHandler(MyHandler);
            MouseDown += new MouseEventHandler(OnMyMouseDown);
            num = 0;
        }
    
        // カードを描画
        private void MyHandler(object sender, PaintEventArgs e)
        {
            Graphics g = e.Graphics;
            if (App.bmp == null)    Application.Exit();
            App.View(g, num, 10, 10);
        }
    
        // クリックでカードを切り替える
        private void OnMyMouseDown(object sender, MouseEventArgs e)
        {
            num= (num+1)%49;
            Invalidate();
        }
    }
    
    //☆ Card Object Class
    class Card
    {
        public  Bitmap  bmp;
        public  int     W;      //Sprite の幅
        public  int     H;      //Sprite の高さ
        public  int     N;      //横の枚数
    
        // Constructor
        public Card(string file, int w, int h)
        {
            try
            {   bmp= new Bitmap(file);   }
            catch
            {   MessageBox.Show("イメージが取得できません", "Error");
                return;
            }
            W= w;
            H= h;
            N = bmp.Width / w;
        }
    
        // 画像全体を描画
        public void View(Graphics g, int x, int y)
        {
            if (bmp!=null)  g.DrawImage(bmp,x,y);
        }
        // Sprite を描画
        public void View(Graphics g, int n, int x, int y)
        {
            Rectangle des = new Rectangle(x, y, W, H);
            Rectangle sou = new Rectangle((n%N)*W,(n/N)*H,W,H);
    
            if (bmp != null)
                g.DrawImage(bmp,des,sou,GraphicsUnit.Pixel);  
        }
    }
    
    class form01
    {
        public static void Main()
        {
            MyForm mf = new MyForm();
            Application.Run(mf);
        }
    }
    
  2. Card class の Constructor で、画像ファイルの名前と一枚当りのカードサイズを受け取ります。
    画像全体の横幅から、横に並んだ枚数(N)を計算します。
        public Card(string file, int w, int h)
        {      ・・・
            W= w;
            H= h;
            N = bmp.Width / w;
        }
    
  3. 指定された番号のカードを切り分けて描画する View() 関数です。
    n がカードの番号で、x, y が描画する座標です。
        // Sprite を描画
        public void View(Graphics g, int n, int x, int y)
        {
            Rectangle des = new Rectangle(x, y, W, H);
            Rectangle sou = new Rectangle((n%N)*W,(n/N)*H,W,H);
    
            if (bmp != null)
                g.DrawImage(bmp,des,sou,GraphicsUnit.Pixel);
        }
    
  4. マウスのクリックでカード番号(num)を切り替えながら描画します。
        int     num;
    
        // カードを描画
        private void MyHandler(object sender, PaintEventArgs e)
        {
            Graphics g = e.Graphics;
            if (App.bmp == null)    Application.Exit();
            App.View(g, num, 10, 10);
        }
    
        // クリックでカードを切り替える
        private void OnMyMouseDown(object sender, MouseEventArgs e)
        {
            num= (num+1)%49;
            Invalidate();
        }
    
  5. 画像の切り分けは Sprite を切り出す を参照して下さい。
    画像を描画する Object Class の基本的な説明は キー操作で画像を移動する を参照して下さい。
    Windows(C++)でも タイマ設定でカードを表示 を作成しています。
    Java でも 画像を切り分ける を作成しています。

前田稔(Maeda Minoru)の超初心者のプログラム入門