利用Matlab製作一款狗頭翻牌子小遊戲

2022-03-02 13:00:31

0 遊戲效果

就是點選一個牌子時，該牌子和周圍四個牌子也會相應發生變化，想辦法讓所有牌子都在同一面即為遊戲勝利。

1 fig介面和背景板

這一段比較簡單，主要是對介面和背景板的屬性設定，我們採用程式設計的方式呼叫app designer控制元件：

ddooggFig=uifigure('units','pixels',...
    'position',[320 120 360 400],...
    'Numbertitle','off',...
    'menubar','none',...
    'resize','off',...
    'name','ddoogg',...
    'color',[0.98 0.98 0.98]);

bkgLabel=uilabel(ddooggFig);
bkgLabel.Position=[10 10 340 340];
bkgLabel.Text='';
bkgLabel.BackgroundColor=[193 214 232]./255;

2 狗狗牌子與勝利標誌

2.1 狗狗牌子繪製

我們用1代表一種狗狗，2代表另一種狗狗,dogMat一開始全為1表示所有牌子上都是第一種狗狗，imgSource代表兩種狗狗圖片位置，bkgColor代表狗狗卡牌的背景顏色

dogMat=ones(5,5); %資料矩陣
imgSource={'imagesdoga.png','imagesdogb.png'}; %狗狗圖片連結
bkgColor=[[252 251 238]./255;[222 248 252]./255];%狗狗圖背景顏色

圖片自取：

doga.png

dogb.png

使用兩層for迴圈算好位置構造控制元件：

%繪製5x5個uiimage控制元件
for i=1:5
    for j=1:5
        dogMatHdl(i,j)=uiimage(ddooggFig);
        dogMatHdl(i,j).Position=[20+65*(j-1),280-65*(i-1),60,60];
        dogMatHdl(i,j).ImageSource=imgSource{1};
        dogMatHdl(i,j).BackgroundColor=bkgColor(1,:);
        dogMatHdl(i,j).UserData=[i,j];
    end
end

注意我們為每個圖片設定一個UserData屬性，這可以表示圖片的位置，方便我們之後識別點選的是哪個圖片。

2.2 遊戲勝利標籤

繪製一個標籤顯示遊戲勝利：

%獲勝標籤
win=false; %是否完成遊戲
winLabel=uilabel(ddooggFig);
winLabel.Position=[15 150 330 60];
winLabel.Text='恭喜你解出謎題，請點選重新開始';
winLabel.BackgroundColor=[238 236 225]./255;
winLabel.FontSize=19;
winLabel.FontWeight='bold';
winLabel.HorizontalAlignment='center';
winLabel.FontColor=[113 106 63]./255;

遊戲一開始標籤式是隱藏的贏了之後才會顯示出來，因此我們先將標籤隱藏：

winLabel.Visible='off';

2.3 滑鼠點選牌子回撥

%建立uiimage回撥
set(dogMatHdl,'ImageClickedFcn',@clickDog)

    function clickDog(~,event)
        if ~win %遊戲贏了不做任何操作
            objNum=event.Source.UserData;
            %點選事件的來源圖片的UserData屬性，與圖片位置相關
            
            crossList=[-1 0;0 1;1 0;0 -1;0 0];
            %點選位置上下左右和自身
            
            for ii=1:5
                changePos=crossList(ii,:)+objNum;%要改變的牌子的位置    
                if all(changePos>=1&changePos<=5)%如果該位置在範圍內，改變圖片顯示和資料矩陣
                    dogMat(changePos(1),changePos(2))=mod(dogMat(changePos(1),changePos(2)),2)+1;
                    dogMatHdl(changePos(1),changePos(2)).ImageSource=imgSource{dogMat(changePos(1),changePos(2))};
                    dogMatHdl(changePos(1),changePos(2)).BackgroundColor=bkgColor(dogMat(changePos(1),changePos(2)),:);
                end
            end
            
            %如果所有卡牌都一樣，遊戲結束
            if all(all(dogMat==1))||all(all(dogMat==2))
                win=true;
                winLabel.Visible='on';
            end
        end
    end

3 遊戲難度按鈕組

3.1 按鈕繪製

繪製三個按鈕，初始 [初級] 按鈕為被選中狀態，即難度等級為一級，我們將gameLevel設定為1，並將 [初級] 按鈕顏色和其他按鈕做區分，表示被選中狀態：

gameLevel=1; %遊戲難度級別
%初級難度按鈕屬性
levelBtn(1)=uibutton(ddooggFig);
levelBtn(1).Position=[10,360,75,30];
levelBtn(1).Text='初級';
levelBtn(1).FontWeight='bold';
levelBtn(1).FontSize=14;
levelBtn(1).BackgroundColor=[13 141 209]./255;
levelBtn(1).FontColor=[1 1 1];
levelBtn(1).UserData=1;
%中級難度按鈕屬性
levelBtn(2)=uibutton(ddooggFig);
levelBtn(2).Position=[95,360,75,30];
levelBtn(2).Text='中級';
levelBtn(2).FontWeight='bold';
levelBtn(2).FontSize=14;
levelBtn(2).BackgroundColor=[2 164 173]./255;
levelBtn(2).FontColor=[1 1 1];
levelBtn(2).UserData=2;
%高階難度按鈕屬性
levelBtn(3)=uibutton(ddooggFig);
levelBtn(3).Position=[180,360,75,30];
levelBtn(3).Text='高階';
levelBtn(3).FontWeight='bold';
levelBtn(3).FontSize=14;
levelBtn(3).BackgroundColor=[2 164 173]./255;
levelBtn(3).FontColor=[1 1 1];
levelBtn(3).UserData=3;

3.2 難度選擇回撥

改變gameLevel的數值，然後改變按鈕顏色

%設定難度選擇回撥
set(levelBtn,'ButtonPushedFcn',@changeLevel)
    function changeLevel(~,event)
        levelBtn(gameLevel).BackgroundColor=[2 164 173]./255;
        objNum=event.Source.UserData;
        gameLevel=objNum;
        levelBtn(gameLevel).BackgroundColor=[13 141 209]./255;   
    end

4 遊戲重新整理模組

4.1 重新整理遊戲按鈕繪製

restartBtn=uibutton(ddooggFig);
restartBtn.Position=[265,360,85,30];
restartBtn.Text='重新開始';
restartBtn.FontWeight='bold';
restartBtn.FontSize=14;
restartBtn.BackgroundColor=[2 164 173]./255;
restartBtn.FontColor=[1 1 1];

4.2 模擬滑鼠點選

我們遊戲一開始和點選重新開始要生成未被完成的遊戲局面，最簡單的生成方式就是模擬滑鼠點選隨機一定數量的卡牌，點選次數越多難度越大，我們之前已經有滑鼠點選的回撥函數了：

function clickDog(~,event)

我們發現我們需要模擬的主要是第二個引數event，同時我們發現我們需要用到的只有event的Source屬性下的UserData資訊，也就是卡牌位置資訊：

objNum=event.Source.UserData;

我們便可以構造一個含有UserData資訊的結構體，例如：

simEvent.Source.UserData=[1，2];

再通過如下方式呼叫clickDog函數：

clickDog([],simEvent)

就能模擬點選第一行第二列的牌子，模擬點選其他牌子操作類似。

4.3 重新整理遊戲回撥

在程式最後需要呼叫一次重新整理遊戲回撥，以保證一點開始就產生謎題。

set(restartBtn,'ButtonPushedFcn',@restart)
    function restart(~,~)
        %相關引數設定:
        %是否獲勝改為否
        %勝利標籤隱藏
        %資料矩陣全為1
        win=false;
        winLabel.Visible='off';
        dogMat=ones(5,5);
        
        %將狗狗牌子恢復至初始狀態
        for ii=1:5
            for jj=1:5
                dogMatHdl(ii,jj).ImageSource=imgSource{1};
                dogMatHdl(ii,jj).BackgroundColor=bkgColor(1,:);
            end
        end

        %依據遊戲難度不同選擇不同模擬點選次數
        switch gameLevel
            case 1,changeTimes=3;
            case 2,changeTimes=5;
            case 3,changeTimes=11;
        end
    
        %模擬點選
        for ii=1:changeTimes
            changePos=randi([1,5],[1,2]);
            simEvent.Source.UserData=changePos;
            clickDog([],simEvent)
        end
    end
restart()

5 完整程式碼

function ddoogg
ddooggFig=uifigure('units','pixels',...
    'position',[320 120 360 400],...
    'Numbertitle','off',...
    'menubar','none',...
    'resize','off',...
    'name','ddoogg',...
    'color',[0.98 0.98 0.98]);

bkgLabel=uilabel(ddooggFig);
bkgLabel.Position=[10 10 340 340];
bkgLabel.Text='';
bkgLabel.BackgroundColor=[193 214 232]./255;


%繪製狗狗和獲勝標籤========================================================
dogMat=ones(5,5); %資料矩陣
imgSource={'imagesdoga.png','imagesdogb.png'}; %狗狗圖片連結
bkgColor=[[252 251 238]./255;[222 248 252]./255];%狗狗圖背景顏色

%繪製5x5個uiimage控制元件
for i=1:5
    for j=1:5
        dogMatHdl(i,j)=uiimage(ddooggFig);
        dogMatHdl(i,j).Position=[20+65*(j-1),280-65*(i-1),60,60];
        dogMatHdl(i,j).ImageSource=imgSource{1};
        dogMatHdl(i,j).BackgroundColor=bkgColor(1,:);
        dogMatHdl(i,j).UserData=[i,j];
    end
end

%獲勝標籤
win=false; %是否完成遊戲
winLabel=uilabel(ddooggFig);
winLabel.Position=[15 150 330 60];
winLabel.Text='恭喜你解出謎題，請點選重新開始';
winLabel.BackgroundColor=[238 236 225]./255;
winLabel.FontSize=19;
winLabel.FontWeight='bold';
winLabel.HorizontalAlignment='center';
winLabel.FontColor=[113 106 63]./255;
winLabel.Visible='off';


%建立uiimage回撥
set(dogMatHdl,'ImageClickedFcn',@clickDog)
    function clickDog(~,event)
        if ~win
            objNum=event.Source.UserData;
            crossList=[-1 0;0 1;1 0;0 -1;0 0];
            for ii=1:5
                changePos=crossList(ii,:)+objNum;
                if all(changePos>=1&changePos<=5)
                    dogMat(changePos(1),changePos(2))=mod(dogMat(changePos(1),changePos(2)),2)+1;
                    dogMatHdl(changePos(1),changePos(2)).ImageSource=imgSource{dogMat(changePos(1),changePos(2))};
                    dogMatHdl(changePos(1),changePos(2)).BackgroundColor=bkgColor(dogMat(changePos(1),changePos(2)),:);
                end
            end
            if all(all(dogMat==1))||all(all(dogMat==2))
                win=true;
                winLabel.Visible='on';
            end
        end
    end

%遊戲等級按鈕==============================================================
gameLevel=1; %遊戲難度級別
%初級難度按鈕屬性
levelBtn(1)=uibutton(ddooggFig);
levelBtn(1).Position=[10,360,75,30];
levelBtn(1).Text='初級';
levelBtn(1).FontWeight='bold';
levelBtn(1).FontSize=14;
levelBtn(1).BackgroundColor=[13 141 209]./255;
levelBtn(1).FontColor=[1 1 1];
levelBtn(1).UserData=1;
%中級難度按鈕屬性
levelBtn(2)=uibutton(ddooggFig);
levelBtn(2).Position=[95,360,75,30];
levelBtn(2).Text='中級';
levelBtn(2).FontWeight='bold';
levelBtn(2).FontSize=14;
levelBtn(2).BackgroundColor=[2 164 173]./255;
levelBtn(2).FontColor=[1 1 1];
levelBtn(2).UserData=2;
%高階難度按鈕屬性
levelBtn(3)=uibutton(ddooggFig);
levelBtn(3).Position=[180,360,75,30];
levelBtn(3).Text='高階';
levelBtn(3).FontWeight='bold';
levelBtn(3).FontSize=14;
levelBtn(3).BackgroundColor=[2 164 173]./255;
levelBtn(3).FontColor=[1 1 1];
levelBtn(3).UserData=3;
%設定難度選擇回撥
set(levelBtn,'ButtonPushedFcn',@changeLevel)
    function changeLevel(~,event)
        levelBtn(gameLevel).BackgroundColor=[2 164 173]./255;
        objNum=event.Source.UserData;
        gameLevel=objNum;
        levelBtn(gameLevel).BackgroundColor=[13 141 209]./255;   
    end


%重新整理遊戲按鈕==============================================================
restartBtn=uibutton(ddooggFig);
restartBtn.Position=[265,360,85,30];
restartBtn.Text='重新開始';
restartBtn.FontWeight='bold';
restartBtn.FontSize=14;
restartBtn.BackgroundColor=[2 164 173]./255;
restartBtn.FontColor=[1 1 1];
%設定重新整理遊戲回撥
set(restartBtn,'ButtonPushedFcn',@restart)
    function restart(~,~)
        win=false;
        winLabel.Visible='off';
        dogMat=ones(5,5);
        for ii=1:5
            for jj=1:5
                dogMatHdl(ii,jj).ImageSource=imgSource{1};
                dogMatHdl(ii,jj).BackgroundColor=bkgColor(1,:);
            end
        end
        switch gameLevel
            case 1,changeTimes=3;
            case 2,changeTimes=5;
            case 3,changeTimes=11;
        end
        for ii=1:changeTimes
            changePos=randi([1,5],[1,2]);
            simEvent.Source.UserData=changePos;
            clickDog([],simEvent)
        end
    end
restart()
end

另：

需要MATLAB版本至少在R2019a及以後，若是以前版本可以嘗試用uiaxes和image進行改寫。

總程式碼長度140行左右，快來試試呀

以上就是利用Matlab製作一款狗頭翻牌子小遊戲的詳細內容，更多關於Matlab狗頭翻牌子游戲的資料請關注it145.com其它相關文章！