宣告:該專案是牛客網的一個開源專案
飛翔小鳥游戲
文章目錄 一 效果圖 二 思維導圖
三 設計步驟
四 原始碼
文章目錄
一 效果圖
二 思維導圖
1.類的屬性關系
<style>#mermaid-svg-eEPiux0clw92ZbwH .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-eEPiux0clw92ZbwH .label text{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .node rect,#mermaid-svg-eEPiux0clw92ZbwH .node circle,#mermaid-svg-eEPiux0clw92ZbwH .node ellipse,#mermaid-svg-eEPiux0clw92ZbwH .node polygon,#mermaid-svg-eEPiux0clw92ZbwH .node path{fill:#ECECFF;stroke:#9370db;stroke-width:1px}#mermaid-svg-eEPiux0clw92ZbwH .node .label{text-align:center;fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .node.clickable{cursor:pointer}#mermaid-svg-eEPiux0clw92ZbwH .arrowheadPath{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .edgePath .path{stroke:#333;stroke-width:1.5px}#mermaid-svg-eEPiux0clw92ZbwH .flowchart-link{stroke:#333;fill:none}#mermaid-svg-eEPiux0clw92ZbwH .edgeLabel{background-color:#e8e8e8;text-align:center}#mermaid-svg-eEPiux0clw92ZbwH .edgeLabel rect{opacity:0.9}#mermaid-svg-eEPiux0clw92ZbwH .edgeLabel span{color:#333}#mermaid-svg-eEPiux0clw92ZbwH .cluster rect{fill:#ffffde;stroke:#aa3;stroke-width:1px}#mermaid-svg-eEPiux0clw92ZbwH .cluster text{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);font-size:12px;background:#ffffde;border:1px solid #aa3;border-radius:2px;pointer-events:none;z-index:100}#mermaid-svg-eEPiux0clw92ZbwH .actor{stroke:#ccf;fill:#ECECFF}#mermaid-svg-eEPiux0clw92ZbwH text.actor>tspan{fill:#000;stroke:none}#mermaid-svg-eEPiux0clw92ZbwH .actor-line{stroke:grey}#mermaid-svg-eEPiux0clw92ZbwH .messageLine0{stroke-width:1.5;stroke-dasharray:none;stroke:#333}#mermaid-svg-eEPiux0clw92ZbwH .messageLine1{stroke-width:1.5;stroke-dasharray:2, 2;stroke:#333}#mermaid-svg-eEPiux0clw92ZbwH #arrowhead path{fill:#333;stroke:#333}#mermaid-svg-eEPiux0clw92ZbwH .sequenceNumber{fill:#fff}#mermaid-svg-eEPiux0clw92ZbwH #sequencenumber{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH #crosshead path{fill:#333;stroke:#333}#mermaid-svg-eEPiux0clw92ZbwH .messageText{fill:#333;stroke:#333}#mermaid-svg-eEPiux0clw92ZbwH .labelBox{stroke:#ccf;fill:#ECECFF}#mermaid-svg-eEPiux0clw92ZbwH .labelText,#mermaid-svg-eEPiux0clw92ZbwH .labelText>tspan{fill:#000;stroke:none}#mermaid-svg-eEPiux0clw92ZbwH .loopText,#mermaid-svg-eEPiux0clw92ZbwH .loopText>tspan{fill:#000;stroke:none}#mermaid-svg-eEPiux0clw92ZbwH .loopLine{stroke-width:2px;stroke-dasharray:2, 2;stroke:#ccf;fill:#ccf}#mermaid-svg-eEPiux0clw92ZbwH .note{stroke:#aa3;fill:#fff5ad}#mermaid-svg-eEPiux0clw92ZbwH .noteText,#mermaid-svg-eEPiux0clw92ZbwH .noteText>tspan{fill:#000;stroke:none}#mermaid-svg-eEPiux0clw92ZbwH .activation0{fill:#f4f4f4;stroke:#666}#mermaid-svg-eEPiux0clw92ZbwH .activation1{fill:#f4f4f4;stroke:#666}#mermaid-svg-eEPiux0clw92ZbwH .activation2{fill:#f4f4f4;stroke:#666}#mermaid-svg-eEPiux0clw92ZbwH .mermaid-main-font{font-family:"trebuchet ms", verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .section{stroke:none;opacity:0.2}#mermaid-svg-eEPiux0clw92ZbwH .section0{fill:rgba(102,102,255,0.49)}#mermaid-svg-eEPiux0clw92ZbwH .section2{fill:#fff400}#mermaid-svg-eEPiux0clw92ZbwH .section1,#mermaid-svg-eEPiux0clw92ZbwH .section3{fill:#fff;opacity:0.2}#mermaid-svg-eEPiux0clw92ZbwH .sectionTitle0{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .sectionTitle1{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .sectionTitle2{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .sectionTitle3{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .sectionTitle{text-anchor:start;font-size:11px;text-height:14px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .grid .tick{stroke:#d3d3d3;opacity:0.8;shape-rendering:crispEdges}#mermaid-svg-eEPiux0clw92ZbwH .grid .tick text{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .grid path{stroke-width:0}#mermaid-svg-eEPiux0clw92ZbwH .today{fill:none;stroke:red;stroke-width:2px}#mermaid-svg-eEPiux0clw92ZbwH .task{stroke-width:2}#mermaid-svg-eEPiux0clw92ZbwH .taskText{text-anchor:middle;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .taskText:not([font-size]){font-size:11px}#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutsideRight{fill:#000;text-anchor:start;font-size:11px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutsideLeft{fill:#000;text-anchor:end;font-size:11px}#mermaid-svg-eEPiux0clw92ZbwH .task.clickable{cursor:pointer}#mermaid-svg-eEPiux0clw92ZbwH .taskText.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold}#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutsideLeft.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold}#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutsideRight.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold}#mermaid-svg-eEPiux0clw92ZbwH .taskText0,#mermaid-svg-eEPiux0clw92ZbwH .taskText1,#mermaid-svg-eEPiux0clw92ZbwH .taskText2,#mermaid-svg-eEPiux0clw92ZbwH .taskText3{fill:#fff}#mermaid-svg-eEPiux0clw92ZbwH .task0,#mermaid-svg-eEPiux0clw92ZbwH .task1,#mermaid-svg-eEPiux0clw92ZbwH .task2,#mermaid-svg-eEPiux0clw92ZbwH .task3{fill:#8a90dd;stroke:#534fbc}#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutside0,#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutside2{fill:#000}#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutside1,#mermaid-svg-eEPiux0clw92ZbwH .taskTextOutside3{fill:#000}#mermaid-svg-eEPiux0clw92ZbwH .active0,#mermaid-svg-eEPiux0clw92ZbwH .active1,#mermaid-svg-eEPiux0clw92ZbwH .active2,#mermaid-svg-eEPiux0clw92ZbwH .active3{fill:#bfc7ff;stroke:#534fbc}#mermaid-svg-eEPiux0clw92ZbwH .activeText0,#mermaid-svg-eEPiux0clw92ZbwH .activeText1,#mermaid-svg-eEPiux0clw92ZbwH .activeText2,#mermaid-svg-eEPiux0clw92ZbwH .activeText3{fill:#000 !important}#mermaid-svg-eEPiux0clw92ZbwH .done0,#mermaid-svg-eEPiux0clw92ZbwH .done1,#mermaid-svg-eEPiux0clw92ZbwH .done2,#mermaid-svg-eEPiux0clw92ZbwH .done3{stroke:grey;fill:#d3d3d3;stroke-width:2}#mermaid-svg-eEPiux0clw92ZbwH .doneText0,#mermaid-svg-eEPiux0clw92ZbwH .doneText1,#mermaid-svg-eEPiux0clw92ZbwH .doneText2,#mermaid-svg-eEPiux0clw92ZbwH .doneText3{fill:#000 !important}#mermaid-svg-eEPiux0clw92ZbwH .crit0,#mermaid-svg-eEPiux0clw92ZbwH .crit1,#mermaid-svg-eEPiux0clw92ZbwH .crit2,#mermaid-svg-eEPiux0clw92ZbwH .crit3{stroke:#f88;fill:red;stroke-width:2}#mermaid-svg-eEPiux0clw92ZbwH .activeCrit0,#mermaid-svg-eEPiux0clw92ZbwH .activeCrit1,#mermaid-svg-eEPiux0clw92ZbwH .activeCrit2,#mermaid-svg-eEPiux0clw92ZbwH .activeCrit3{stroke:#f88;fill:#bfc7ff;stroke-width:2}#mermaid-svg-eEPiux0clw92ZbwH .doneCrit0,#mermaid-svg-eEPiux0clw92ZbwH .doneCrit1,#mermaid-svg-eEPiux0clw92ZbwH .doneCrit2,#mermaid-svg-eEPiux0clw92ZbwH .doneCrit3{stroke:#f88;fill:#d3d3d3;stroke-width:2;cursor:pointer;shape-rendering:crispEdges}#mermaid-svg-eEPiux0clw92ZbwH .milestone{transform:rotate(45deg) scale(0.8, 0.8)}#mermaid-svg-eEPiux0clw92ZbwH .milestoneText{font-style:italic}#mermaid-svg-eEPiux0clw92ZbwH .doneCritText0,#mermaid-svg-eEPiux0clw92ZbwH .doneCritText1,#mermaid-svg-eEPiux0clw92ZbwH .doneCritText2,#mermaid-svg-eEPiux0clw92ZbwH .doneCritText3{fill:#000 !important}#mermaid-svg-eEPiux0clw92ZbwH .activeCritText0,#mermaid-svg-eEPiux0clw92ZbwH .activeCritText1,#mermaid-svg-eEPiux0clw92ZbwH .activeCritText2,#mermaid-svg-eEPiux0clw92ZbwH .activeCritText3{fill:#000 !important}#mermaid-svg-eEPiux0clw92ZbwH .titleText{text-anchor:middle;font-size:18px;fill:#000;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH g.classGroup text{fill:#9370db;stroke:none;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);font-size:10px}#mermaid-svg-eEPiux0clw92ZbwH g.classGroup text .title{font-weight:bolder}#mermaid-svg-eEPiux0clw92ZbwH g.clickable{cursor:pointer}#mermaid-svg-eEPiux0clw92ZbwH g.classGroup rect{fill:#ECECFF;stroke:#9370db}#mermaid-svg-eEPiux0clw92ZbwH g.classGroup line{stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH .classLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.5}#mermaid-svg-eEPiux0clw92ZbwH .classLabel .label{fill:#9370db;font-size:10px}#mermaid-svg-eEPiux0clw92ZbwH .relation{stroke:#9370db;stroke-width:1;fill:none}#mermaid-svg-eEPiux0clw92ZbwH .dashed-line{stroke-dasharray:3}#mermaid-svg-eEPiux0clw92ZbwH #compositionStart{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH #compositionEnd{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH #aggregationStart{fill:#ECECFF;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH #aggregationEnd{fill:#ECECFF;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH #dependencyStart{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH #dependencyEnd{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH #extensionStart{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH #extensionEnd{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH .commit-id,#mermaid-svg-eEPiux0clw92ZbwH .commit-msg,#mermaid-svg-eEPiux0clw92ZbwH .branch-label{fill:lightgrey;color:lightgrey;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .pieTitleText{text-anchor:middle;font-size:25px;fill:#000;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .slice{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH g.stateGroup text{fill:#9370db;stroke:none;font-size:10px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH g.stateGroup text{fill:#9370db;fill:#333;stroke:none;font-size:10px}#mermaid-svg-eEPiux0clw92ZbwH g.statediagram-cluster .cluster-label text{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH g.stateGroup .state-title{font-weight:bolder;fill:#000}#mermaid-svg-eEPiux0clw92ZbwH g.stateGroup rect{fill:#ECECFF;stroke:#9370db}#mermaid-svg-eEPiux0clw92ZbwH g.stateGroup line{stroke:#9370db;stroke-width:1}#mermaid-svg-eEPiux0clw92ZbwH .transition{stroke:#9370db;stroke-width:1;fill:none}#mermaid-svg-eEPiux0clw92ZbwH .stateGroup .composit{fill:white;border-bottom:1px}#mermaid-svg-eEPiux0clw92ZbwH .stateGroup .alt-composit{fill:#e0e0e0;border-bottom:1px}#mermaid-svg-eEPiux0clw92ZbwH .state-note{stroke:#aa3;fill:#fff5ad}#mermaid-svg-eEPiux0clw92ZbwH .state-note text{fill:black;stroke:none;font-size:10px}#mermaid-svg-eEPiux0clw92ZbwH .stateLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.7}#mermaid-svg-eEPiux0clw92ZbwH .edgeLabel text{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .stateLabel text{fill:#000;font-size:10px;font-weight:bold;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-eEPiux0clw92ZbwH .node circle.state-start{fill:black;stroke:black}#mermaid-svg-eEPiux0clw92ZbwH .node circle.state-end{fill:black;stroke:white;stroke-width:1.5}#mermaid-svg-eEPiux0clw92ZbwH #statediagram-barbEnd{fill:#9370db}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-cluster rect{fill:#ECECFF;stroke:#9370db;stroke-width:1px}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-cluster rect.outer{rx:5px;ry:5px}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-state .divider{stroke:#9370db}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-state .title-state{rx:5px;ry:5px}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-cluster.statediagram-cluster .inner{fill:white}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-cluster.statediagram-cluster-alt .inner{fill:#e0e0e0}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-cluster .inner{rx:0;ry:0}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-state rect.basic{rx:5px;ry:5px}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-state rect.divider{stroke-dasharray:10,10;fill:#efefef}#mermaid-svg-eEPiux0clw92ZbwH .note-edge{stroke-dasharray:5}#mermaid-svg-eEPiux0clw92ZbwH .statediagram-note rect{fill:#fff5ad;stroke:#aa3;stroke-width:1px;rx:0;ry:0}:root{--mermaid-font-family: '"trebuchet ms", verdana, arial';--mermaid-font-family: "Comic Sans MS", "Comic Sans", cursive}#mermaid-svg-eEPiux0clw92ZbwH .error-icon{fill:#522}#mermaid-svg-eEPiux0clw92ZbwH .error-text{fill:#522;stroke:#522}#mermaid-svg-eEPiux0clw92ZbwH .edge-thickness-normal{stroke-width:2px}#mermaid-svg-eEPiux0clw92ZbwH .edge-thickness-thick{stroke-width:3.5px}#mermaid-svg-eEPiux0clw92ZbwH .edge-pattern-solid{stroke-dasharray:0}#mermaid-svg-eEPiux0clw92ZbwH .edge-pattern-dashed{stroke-dasharray:3}#mermaid-svg-eEPiux0clw92ZbwH .edge-pattern-dotted{stroke-dasharray:2}#mermaid-svg-eEPiux0clw92ZbwH .marker{fill:#333}#mermaid-svg-eEPiux0clw92ZbwH .marker.cross{stroke:#333}
:root { --mermaid-font-family: "trebuchet ms", verdana, arial;}</style>
<style>#mermaid-svg-eEPiux0clw92ZbwH {
color: rgba(0, 0, 0, 0.75);
font: ;
}</style>
飛翔小鳥游戲類
小鳥類
游戲分數
開始結束背景圖
游戲運行狀態
位置坐標
影像長寬
速度
位移傾角
小鳥圖形
地面類
位置坐標
影像長寬
地面影像
柱子類
位置坐標
影像長寬
柱子影像
2.類的相關方法
<style>#mermaid-svg-brDc1I7euiGhlrdT .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-brDc1I7euiGhlrdT .label text{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .node rect,#mermaid-svg-brDc1I7euiGhlrdT .node circle,#mermaid-svg-brDc1I7euiGhlrdT .node ellipse,#mermaid-svg-brDc1I7euiGhlrdT .node polygon,#mermaid-svg-brDc1I7euiGhlrdT .node path{fill:#ECECFF;stroke:#9370db;stroke-width:1px}#mermaid-svg-brDc1I7euiGhlrdT .node .label{text-align:center;fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .node.clickable{cursor:pointer}#mermaid-svg-brDc1I7euiGhlrdT .arrowheadPath{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .edgePath .path{stroke:#333;stroke-width:1.5px}#mermaid-svg-brDc1I7euiGhlrdT .flowchart-link{stroke:#333;fill:none}#mermaid-svg-brDc1I7euiGhlrdT .edgeLabel{background-color:#e8e8e8;text-align:center}#mermaid-svg-brDc1I7euiGhlrdT .edgeLabel rect{opacity:0.9}#mermaid-svg-brDc1I7euiGhlrdT .edgeLabel span{color:#333}#mermaid-svg-brDc1I7euiGhlrdT .cluster rect{fill:#ffffde;stroke:#aa3;stroke-width:1px}#mermaid-svg-brDc1I7euiGhlrdT .cluster text{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);font-size:12px;background:#ffffde;border:1px solid #aa3;border-radius:2px;pointer-events:none;z-index:100}#mermaid-svg-brDc1I7euiGhlrdT .actor{stroke:#ccf;fill:#ECECFF}#mermaid-svg-brDc1I7euiGhlrdT text.actor>tspan{fill:#000;stroke:none}#mermaid-svg-brDc1I7euiGhlrdT .actor-line{stroke:grey}#mermaid-svg-brDc1I7euiGhlrdT .messageLine0{stroke-width:1.5;stroke-dasharray:none;stroke:#333}#mermaid-svg-brDc1I7euiGhlrdT .messageLine1{stroke-width:1.5;stroke-dasharray:2, 2;stroke:#333}#mermaid-svg-brDc1I7euiGhlrdT #arrowhead path{fill:#333;stroke:#333}#mermaid-svg-brDc1I7euiGhlrdT .sequenceNumber{fill:#fff}#mermaid-svg-brDc1I7euiGhlrdT #sequencenumber{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT #crosshead path{fill:#333;stroke:#333}#mermaid-svg-brDc1I7euiGhlrdT .messageText{fill:#333;stroke:#333}#mermaid-svg-brDc1I7euiGhlrdT .labelBox{stroke:#ccf;fill:#ECECFF}#mermaid-svg-brDc1I7euiGhlrdT .labelText,#mermaid-svg-brDc1I7euiGhlrdT .labelText>tspan{fill:#000;stroke:none}#mermaid-svg-brDc1I7euiGhlrdT .loopText,#mermaid-svg-brDc1I7euiGhlrdT .loopText>tspan{fill:#000;stroke:none}#mermaid-svg-brDc1I7euiGhlrdT .loopLine{stroke-width:2px;stroke-dasharray:2, 2;stroke:#ccf;fill:#ccf}#mermaid-svg-brDc1I7euiGhlrdT .note{stroke:#aa3;fill:#fff5ad}#mermaid-svg-brDc1I7euiGhlrdT .noteText,#mermaid-svg-brDc1I7euiGhlrdT .noteText>tspan{fill:#000;stroke:none}#mermaid-svg-brDc1I7euiGhlrdT .activation0{fill:#f4f4f4;stroke:#666}#mermaid-svg-brDc1I7euiGhlrdT .activation1{fill:#f4f4f4;stroke:#666}#mermaid-svg-brDc1I7euiGhlrdT .activation2{fill:#f4f4f4;stroke:#666}#mermaid-svg-brDc1I7euiGhlrdT .mermaid-main-font{font-family:"trebuchet ms", verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .section{stroke:none;opacity:0.2}#mermaid-svg-brDc1I7euiGhlrdT .section0{fill:rgba(102,102,255,0.49)}#mermaid-svg-brDc1I7euiGhlrdT .section2{fill:#fff400}#mermaid-svg-brDc1I7euiGhlrdT .section1,#mermaid-svg-brDc1I7euiGhlrdT .section3{fill:#fff;opacity:0.2}#mermaid-svg-brDc1I7euiGhlrdT .sectionTitle0{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .sectionTitle1{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .sectionTitle2{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .sectionTitle3{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .sectionTitle{text-anchor:start;font-size:11px;text-height:14px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .grid .tick{stroke:#d3d3d3;opacity:0.8;shape-rendering:crispEdges}#mermaid-svg-brDc1I7euiGhlrdT .grid .tick text{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .grid path{stroke-width:0}#mermaid-svg-brDc1I7euiGhlrdT .today{fill:none;stroke:red;stroke-width:2px}#mermaid-svg-brDc1I7euiGhlrdT .task{stroke-width:2}#mermaid-svg-brDc1I7euiGhlrdT .taskText{text-anchor:middle;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .taskText:not([font-size]){font-size:11px}#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutsideRight{fill:#000;text-anchor:start;font-size:11px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutsideLeft{fill:#000;text-anchor:end;font-size:11px}#mermaid-svg-brDc1I7euiGhlrdT .task.clickable{cursor:pointer}#mermaid-svg-brDc1I7euiGhlrdT .taskText.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold}#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutsideLeft.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold}#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutsideRight.clickable{cursor:pointer;fill:#003163 !important;font-weight:bold}#mermaid-svg-brDc1I7euiGhlrdT .taskText0,#mermaid-svg-brDc1I7euiGhlrdT .taskText1,#mermaid-svg-brDc1I7euiGhlrdT .taskText2,#mermaid-svg-brDc1I7euiGhlrdT .taskText3{fill:#fff}#mermaid-svg-brDc1I7euiGhlrdT .task0,#mermaid-svg-brDc1I7euiGhlrdT .task1,#mermaid-svg-brDc1I7euiGhlrdT .task2,#mermaid-svg-brDc1I7euiGhlrdT .task3{fill:#8a90dd;stroke:#534fbc}#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutside0,#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutside2{fill:#000}#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutside1,#mermaid-svg-brDc1I7euiGhlrdT .taskTextOutside3{fill:#000}#mermaid-svg-brDc1I7euiGhlrdT .active0,#mermaid-svg-brDc1I7euiGhlrdT .active1,#mermaid-svg-brDc1I7euiGhlrdT .active2,#mermaid-svg-brDc1I7euiGhlrdT .active3{fill:#bfc7ff;stroke:#534fbc}#mermaid-svg-brDc1I7euiGhlrdT .activeText0,#mermaid-svg-brDc1I7euiGhlrdT .activeText1,#mermaid-svg-brDc1I7euiGhlrdT .activeText2,#mermaid-svg-brDc1I7euiGhlrdT .activeText3{fill:#000 !important}#mermaid-svg-brDc1I7euiGhlrdT .done0,#mermaid-svg-brDc1I7euiGhlrdT .done1,#mermaid-svg-brDc1I7euiGhlrdT .done2,#mermaid-svg-brDc1I7euiGhlrdT .done3{stroke:grey;fill:#d3d3d3;stroke-width:2}#mermaid-svg-brDc1I7euiGhlrdT .doneText0,#mermaid-svg-brDc1I7euiGhlrdT .doneText1,#mermaid-svg-brDc1I7euiGhlrdT .doneText2,#mermaid-svg-brDc1I7euiGhlrdT .doneText3{fill:#000 !important}#mermaid-svg-brDc1I7euiGhlrdT .crit0,#mermaid-svg-brDc1I7euiGhlrdT .crit1,#mermaid-svg-brDc1I7euiGhlrdT .crit2,#mermaid-svg-brDc1I7euiGhlrdT .crit3{stroke:#f88;fill:red;stroke-width:2}#mermaid-svg-brDc1I7euiGhlrdT .activeCrit0,#mermaid-svg-brDc1I7euiGhlrdT .activeCrit1,#mermaid-svg-brDc1I7euiGhlrdT .activeCrit2,#mermaid-svg-brDc1I7euiGhlrdT .activeCrit3{stroke:#f88;fill:#bfc7ff;stroke-width:2}#mermaid-svg-brDc1I7euiGhlrdT .doneCrit0,#mermaid-svg-brDc1I7euiGhlrdT .doneCrit1,#mermaid-svg-brDc1I7euiGhlrdT .doneCrit2,#mermaid-svg-brDc1I7euiGhlrdT .doneCrit3{stroke:#f88;fill:#d3d3d3;stroke-width:2;cursor:pointer;shape-rendering:crispEdges}#mermaid-svg-brDc1I7euiGhlrdT .milestone{transform:rotate(45deg) scale(0.8, 0.8)}#mermaid-svg-brDc1I7euiGhlrdT .milestoneText{font-style:italic}#mermaid-svg-brDc1I7euiGhlrdT .doneCritText0,#mermaid-svg-brDc1I7euiGhlrdT .doneCritText1,#mermaid-svg-brDc1I7euiGhlrdT .doneCritText2,#mermaid-svg-brDc1I7euiGhlrdT .doneCritText3{fill:#000 !important}#mermaid-svg-brDc1I7euiGhlrdT .activeCritText0,#mermaid-svg-brDc1I7euiGhlrdT .activeCritText1,#mermaid-svg-brDc1I7euiGhlrdT .activeCritText2,#mermaid-svg-brDc1I7euiGhlrdT .activeCritText3{fill:#000 !important}#mermaid-svg-brDc1I7euiGhlrdT .titleText{text-anchor:middle;font-size:18px;fill:#000;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT g.classGroup text{fill:#9370db;stroke:none;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);font-size:10px}#mermaid-svg-brDc1I7euiGhlrdT g.classGroup text .title{font-weight:bolder}#mermaid-svg-brDc1I7euiGhlrdT g.clickable{cursor:pointer}#mermaid-svg-brDc1I7euiGhlrdT g.classGroup rect{fill:#ECECFF;stroke:#9370db}#mermaid-svg-brDc1I7euiGhlrdT g.classGroup line{stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT .classLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.5}#mermaid-svg-brDc1I7euiGhlrdT .classLabel .label{fill:#9370db;font-size:10px}#mermaid-svg-brDc1I7euiGhlrdT .relation{stroke:#9370db;stroke-width:1;fill:none}#mermaid-svg-brDc1I7euiGhlrdT .dashed-line{stroke-dasharray:3}#mermaid-svg-brDc1I7euiGhlrdT #compositionStart{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT #compositionEnd{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT #aggregationStart{fill:#ECECFF;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT #aggregationEnd{fill:#ECECFF;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT #dependencyStart{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT #dependencyEnd{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT #extensionStart{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT #extensionEnd{fill:#9370db;stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT .commit-id,#mermaid-svg-brDc1I7euiGhlrdT .commit-msg,#mermaid-svg-brDc1I7euiGhlrdT .branch-label{fill:lightgrey;color:lightgrey;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .pieTitleText{text-anchor:middle;font-size:25px;fill:#000;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .slice{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT g.stateGroup text{fill:#9370db;stroke:none;font-size:10px;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT g.stateGroup text{fill:#9370db;fill:#333;stroke:none;font-size:10px}#mermaid-svg-brDc1I7euiGhlrdT g.statediagram-cluster .cluster-label text{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT g.stateGroup .state-title{font-weight:bolder;fill:#000}#mermaid-svg-brDc1I7euiGhlrdT g.stateGroup rect{fill:#ECECFF;stroke:#9370db}#mermaid-svg-brDc1I7euiGhlrdT g.stateGroup line{stroke:#9370db;stroke-width:1}#mermaid-svg-brDc1I7euiGhlrdT .transition{stroke:#9370db;stroke-width:1;fill:none}#mermaid-svg-brDc1I7euiGhlrdT .stateGroup .composit{fill:white;border-bottom:1px}#mermaid-svg-brDc1I7euiGhlrdT .stateGroup .alt-composit{fill:#e0e0e0;border-bottom:1px}#mermaid-svg-brDc1I7euiGhlrdT .state-note{stroke:#aa3;fill:#fff5ad}#mermaid-svg-brDc1I7euiGhlrdT .state-note text{fill:black;stroke:none;font-size:10px}#mermaid-svg-brDc1I7euiGhlrdT .stateLabel .box{stroke:none;stroke-width:0;fill:#ECECFF;opacity:0.7}#mermaid-svg-brDc1I7euiGhlrdT .edgeLabel text{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .stateLabel text{fill:#000;font-size:10px;font-weight:bold;font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family)}#mermaid-svg-brDc1I7euiGhlrdT .node circle.state-start{fill:black;stroke:black}#mermaid-svg-brDc1I7euiGhlrdT .node circle.state-end{fill:black;stroke:white;stroke-width:1.5}#mermaid-svg-brDc1I7euiGhlrdT #statediagram-barbEnd{fill:#9370db}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-cluster rect{fill:#ECECFF;stroke:#9370db;stroke-width:1px}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-cluster rect.outer{rx:5px;ry:5px}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-state .divider{stroke:#9370db}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-state .title-state{rx:5px;ry:5px}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-cluster.statediagram-cluster .inner{fill:white}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-cluster.statediagram-cluster-alt .inner{fill:#e0e0e0}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-cluster .inner{rx:0;ry:0}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-state rect.basic{rx:5px;ry:5px}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-state rect.divider{stroke-dasharray:10,10;fill:#efefef}#mermaid-svg-brDc1I7euiGhlrdT .note-edge{stroke-dasharray:5}#mermaid-svg-brDc1I7euiGhlrdT .statediagram-note rect{fill:#fff5ad;stroke:#aa3;stroke-width:1px;rx:0;ry:0}:root{--mermaid-font-family: '"trebuchet ms", verdana, arial';--mermaid-font-family: "Comic Sans MS", "Comic Sans", cursive}#mermaid-svg-brDc1I7euiGhlrdT .error-icon{fill:#522}#mermaid-svg-brDc1I7euiGhlrdT .error-text{fill:#522;stroke:#522}#mermaid-svg-brDc1I7euiGhlrdT .edge-thickness-normal{stroke-width:2px}#mermaid-svg-brDc1I7euiGhlrdT .edge-thickness-thick{stroke-width:3.5px}#mermaid-svg-brDc1I7euiGhlrdT .edge-pattern-solid{stroke-dasharray:0}#mermaid-svg-brDc1I7euiGhlrdT .edge-pattern-dashed{stroke-dasharray:3}#mermaid-svg-brDc1I7euiGhlrdT .edge-pattern-dotted{stroke-dasharray:2}#mermaid-svg-brDc1I7euiGhlrdT .marker{fill:#333}#mermaid-svg-brDc1I7euiGhlrdT .marker.cross{stroke:#333}
:root { --mermaid-font-family: "trebuchet ms", verdana, arial;}</style>
<style>#mermaid-svg-brDc1I7euiGhlrdT {
color: rgba(0, 0, 0, 0.75);
font: ;
}</style>
game
Bird
BirdGame
BirdGame-構造器
paint--繪制方法
action--游戲運行
main--主函式啟動
Bird--構造器
fly--飛行動作
step--移動
flappy--飛行重置
hit--判斷是否撞到柱子或地面
Column
Column--構造器
step--移動
Ground
Ground--構造器
step--移動
三 設計步驟
1.素材準備
相關的素材我放到了github倉庫, github地址https://github.com/ORikkaO/BirdGame
2.預備知識及其運用
1.面向物件的封裝:設計包裝出小鳥、地面、柱子、游戲四個類, 2.swing和awt包:圖形界面工具,繪制出游戲場景, 3.Math類:運用atan等方法輔助完成小鳥旋轉角度轉換, 4.事件監聽器:運用滑鼠監聽器完成游戲狀態轉換及小鳥移動, 5.多執行緒:該專案就用到了一個sleep休眠,
相關的知識用到的不多,一邊做一邊學習(熟悉)運用就好,
3.大體流程
1.繪制面板,放入背景圖, 2.設計地面、柱子類完成移動的效果(移動方法實作), 3.設計小鳥,完成飛行軌跡、與柱子是否碰撞的方法等, 4.設計游戲類,完成游戲類界面的繪制, 5.設計游戲開始的方法與流程, 6.增加滑鼠監聽器完成對小鳥飛行及游戲運行的控制,
四 原始碼
1.游戲類
package game;
import javax. imageio. ImageIO;
import java. util. *;
import javax. swing. *;
import java. awt. Graphics;
import java. awt. event. MouseAdapter;
import java. awt. event. *;
import java. awt. image. BufferedImage;
import javax. imageio. *;
import java. awt. *;
public class BirdGame extends JPanel {
Image background; //背景圖片
Image startImage; //開始圖片
Image overImage; //游戲結束圖片
Ground ground; //地面
Column column1, column2; //兩根柱子
Bird bird; //小鳥
int score; //游戲分數
int state; //游戲狀態
//狀態常量
public static final int START= 0 ; //開始
public static final int RUNNING= 1 ; //運行
public static final int GAME_OVER= 2 ; //結束
public BirdGame ( ) throws Exception
{
//初始背景圖片
//background = new ImageIcon("D:\\java\\elipse\\project_workplace\\Bird\\src\\resources\\bg.png").getImage();//絕對路徑
//background = new ImageIcon("src\\resources\\bg.png").getImage();//相對路徑,一開始默認位置是Bird專案檔案夾
background = new ImageIcon ( "./source/bg.png" ) . getImage ( ) ;
startImage = new ImageIcon ( "./source/start.png" ) . getImage ( ) ;
overImage= new ImageIcon ( "./source/gameover.png" ) . getImage ( ) ;
//初始化地面、柱子、小鳥、分號、狀態
ground= new Ground ( ) ;
column1= new Column ( 1 ) ;
column2= new Column ( 2 ) ;
bird= new Bird ( ) ;
score= 0 ;
state= 0 ;
}
public void paint ( Graphics g)
{
//繪制背景
g. drawImage ( background, 0 , 0 , null) ;
//繪制地面
g. drawImage ( ground. image, ground. x, ground. y, null) ;
//繪制柱子
g. drawImage ( column1. image, column1. x- column1. width/ 2 , column1. y- column1. height/ 2 , null) ;
g. drawImage ( column2. image, column2. x- column2. width/ 2 , column2. y- column2. height/ 2 , null) ;
//繪制小鳥
Graphics2D g2= ( Graphics2D) g;
g2. rotate ( - bird. alpha, bird. x, bird. y) ;
g. drawImage ( bird. image, bird. x- bird. width/ 2 , bird. y- bird. height/ 2 , null) ;
g2. rotate ( bird. alpha, bird. x, bird. y) ;
//繪制分數
Font f= new Font ( Font. SANS_SERIF, Font. BOLD, 40 ) ;
g. setFont ( f) ;
g. drawString ( "" + score, 40 , 60 ) ;
g. setColor ( Color. WHITE) ;
g. drawString ( "" + score, 40 - 3 , 60 - 3 ) ; //一個陰影效果
//繪制開始和結束界面
switch ( state)
{
case START:
g. drawImage ( startImage, 0 , 0 , null) ;
break ;
case GAME_OVER:
g. drawImage ( overImage, 0 , 0 , null) ;
break ;
}
}
public void action ( ) throws Exception
{
//不斷重復和繪制
MouseListener l= new MouseAdapter ( )
{
public void mousePressed ( MouseEvent e)
{
try {
switch ( state) {
case START:
//在開始前按下滑鼠轉為運行狀態
state= RUNNING;
break ;
case RUNNING:
//在運行狀態,按下滑鼠小鳥向上飛行
bird. flappy ( ) ;
break ;
case GAME_OVER:
//在結束狀態,按下滑鼠重置資料變為開始
column1= new Column ( 1 ) ;
column2= new Column ( 2 ) ;
bird= new Bird ( ) ;
score= 0 ;
state= START;
break ;
}
}
catch ( Exception ex)
{
ex. printStackTrace ( ) ;
}
}
} ;
addMouseListener ( l) ;
while ( true )
{
switch ( state)
{
case START:
bird. fly ( ) ;
ground. step ( ) ;
break ;
case RUNNING:
ground. step ( ) ;
column1. step ( ) ;
column2. step ( ) ;
bird. fly ( ) ;
bird. step ( ) ;
// if(bird.x==column1.x||bird.x==column2.x)
// {
// score++;
// }
score++ ;
//檢測是否碰撞
if ( bird. hit ( ground) || bird. hit ( column1) || bird. hit ( column2) )
{
state= GAME_OVER;
}
break ;
}
//休眠1000/60毫秒
Thread. sleep ( 1000 / 60 ) ;
repaint ( ) ;
}
}
//啟動方法
public static void main ( String[ ] args) throws Exception
{
JFrame frame= new JFrame ( ) ;
BirdGame game= new BirdGame ( ) ;
frame. add ( game) ;
frame. setSize ( 440 , 670 ) ;
frame. setLocationRelativeTo ( null) ;
frame. setDefaultCloseOperation ( JFrame. EXIT_ON_CLOSE) ;
frame. setVisible ( true ) ;
game. action ( ) ;
}
}
2.地面類
package game;
import javax. swing. *;
import java. awt. *;
public class Ground {
Image image;
int x, y; //位置
int width, height;
//地面初始化
public Ground ( ) throws Exception
{
image = new ImageIcon ( "source/ground.png" ) . getImage ( ) ;
width= image. getWidth ( null) ;
height= image. getHeight ( null) ;
x= 0 ;
y= 500 ;
}
//左移
public void step ( )
{
x-= 4 ;
if ( x<= - 109 )
{
x= 0 ;
}
}
}
3.小鳥類
package game;
import java. awt. *;
import javax. swing. *;
import javax. imageio. ImageIO;
public class Bird {
Image image;
int x, y;
int width, height;
int size;
//重力加速度
double g;
//位移間隔時間
double t;
//最初速度
double v0;
//當前上拋速度
double speed;
//經過時間t后的位移
double s;
//小鳥的傾角(弧度)
double alpha;
//一組圖片記錄小鳥影片幀
Image[ ] images;
//幀數下標
int index;
public Bird ( ) throws Exception
{
image= new ImageIcon ( "source/0.png" ) . getImage ( ) ;
width = image. getWidth ( null) ;
height = image. getHeight ( null) ;
x= 132 ;
y= 280 ;
size= 40 ;
//位移引數
g= 4 ;
v0= 20 ;
t= 0.25 ;
speed= v0;
s= 0 ;
//小鳥偏轉角度
alpha= 0 ;
//初始化影片幀引數
images= new Image [ 8 ] ;
for ( int i= 0 ; i< 8 ; i++ )
{
images[ i] = new ImageIcon ( "source/" + i+ ".png" ) . getImage ( ) ;
}
index= 0 ;
}
//飛行動作(變化一幀)
public void fly ( )
{
index++ ;
image= images[ ( index/ 12 ) % 8 ] ;
}
//移動一步
public void step ( )
{
double v0= speed;
//計算上跑位移
s= v0* t+ g* t* t/ 2 ;
//計算鳥的坐標
y= y- ( int ) s;
//計算下次移動速度
double v= v0- g* t;
speed = v;
//計算傾角(反正切函式)
alpha= Math. atan ( s/ 8 ) ;
}
//向上飛行
public void flappy ( )
{
//重置速度
speed= v0;
}
//檢測小鳥是否碰撞到地面
public boolean hit ( Ground ground)
{
boolean hit = y+ size/ 2 > ground. y;
if ( hit)
{
y= ground. y- size/ 2 ;
alpha= Math. PI/ 2 ;
}
return hit;
}
//檢測小鳥是否撞到柱子
public boolean hit ( Column column)
{
//檢測是否在柱子范圍內
if ( x> column. x- column. width/ 2 - size/ 2 && x< column. x+ column. width/ 2 + size/ 2 )
{
if ( y> column. y- column. gap/ 2 + size/ 2 && y< column. y+ column. gap/ 2 - size/ 2 ) return false ;
return true ;
}
return false ;
}
}
4.柱子類
package game;
import java. util. *;
import java. awt. *;
import javax. imageio. ImageIO;
import javax. swing. *;
public class Column {
Image image;
int x, y;
int width, height;
//柱子之間縫隙
int gap;
//柱子之間的距離
int distance;
Random random = new Random ( ) ;
//初始第N根柱子
public Column ( int n) throws Exception
{
image= new ImageIcon ( "source/column.png" ) . getImage ( ) ;
width= image. getWidth ( null) ;
height= image. getHeight ( null) ;
gap= 144 ;
distance= 245 ;
x= 550 + ( n- 1 ) * distance;
y= random. nextInt ( 218 ) + 132 ;
}
public void step ( )
{
x-= 4 ;
if ( x<= - width/ 2 )
{
x= distance* 2 - width/ 2 ;
y= random. nextInt ( 218 ) ;
}
}
}