हाय हमर!
आज मैं बात करना चाहता हूं कि कैनवस का उपयोग करके एंड्रॉइड ओएस के लिए एक सरल लॉजिक गेम कैसे लिखा जाए। मैं इस खेल के बारे में 5 साल पहले अपने फोन पर मिला था। नाम भूल गया था, और कई विषयगत मंचों पर खोज करने से कुछ भी नहीं हुआ, और मैंने इस खेल के अपने कार्यान्वयन को लिखने का फैसला किया। मेरे लिए विकास अधिक शौक है, हालांकि कभी-कभी मैं छोटी परियोजनाओं पर काम करता हूं। कुछ विचार के बाद, मैंने इंजन का उपयोग नहीं करने का फैसला किया, लेकिन अपने दम पर लिखने के लिए। इस निर्णय के लिए कारण: कैनवस के साथ अनुभव प्राप्त करने की इच्छा।

लब्बोलुआब यह है कि ...

एक शतरंज के समान खेल का मैदान है, लेकिन कोशिकाओं को काले और सफेद में विभाजित किए बिना। क्षेत्र का आकार मनमाना हो सकता है, लेकिन 2x3 से छोटे क्षेत्र पर खेलना बहुत मायने नहीं रखता है। मुझे 10x10 के मैदान पर खेलना पसंद है।

खिलाड़ियों की संख्या मनमानी हो सकती है, लेकिन मेरी राय में एक साथ या चार खेलना अधिक दिलचस्प है। यदि आप एक आयताकार मैदान पर एक साथ तीन खेलते हैं, तो एक असंतुलन होता है, क्योंकि खिलाड़ियों में से एक "खाली" कोने से दूर होगा। यदि आप 4 से अधिक लोगों के साथ खेलते हैं, तो अपनी रणनीति को लागू करना मुश्किल है।

प्रत्येक खिलाड़ी को बदले में एक वस्तु (चलो इसे एक परमाणु कहते हैं) एक नि: शुल्क सेल या एक सेल में रखनी चाहिए जहां इसके परमाणु पहले से मौजूद हैं। यदि एक "महत्वपूर्ण द्रव्यमान" एक सेल में जमा होता है, तो पड़ोसी कोशिकाओं की संख्या के बराबर, तो इस सेल से परमाणु पड़ोसी कोशिकाओं में चले जाते हैं, जबकि पड़ोसी कोशिकाओं में परमाणुओं को "कैप्चर" किया जाता है, अर्थात्। वे अब उस खिलाड़ी के हैं जिनके परमाणु बिखरे हुए हैं।

बिंदु को स्पष्ट करने के लिए चित्रों की एक जोड़ी।

एक खाली 4x4 क्षेत्र प्रत्येक कोशिका के लिए महत्वपूर्ण द्रव्यमान का संकेत देता है।


तीसरी चाल के बाद खेल की स्थिति।


चौथी चाल के बाद खेल की स्थिति (पहला नीला)। यह देखा जाता है कि ऊपरी बाएं कोने में परमाणुओं की एक महत्वपूर्ण संख्या जमा हो गई है।


बाह! उन्होंने बिखरे हुए, सेल में 2 नीले परमाणुओं को कैप्चर किया [0] [1]। और इस सेल में [0] [1] अब एक महत्वपूर्ण मात्रा भी है। चेन रिएक्शन!


विस्तार के बाद की स्थिति। चौथी चाल का अंत। नीला अब पाँचवाँ मूव करेगी।

बोध। ग्राफिक हिस्सा है।

आइए क्रियान्वयन के लिए नीचे उतरें। आइए View से व्युत्पन्न एक क्लास बनाएं।

public class GameView extends View { private Bitmap mBitmap; private Canvas mCanvas; private Paint paint, mBitmapPaint; private float canvasSize; private final int horizontalCountOfCells, verticalCountOfCells; public GameView(Context context, AttributeSet attrs) { super(context, attrs); //   horizontalCountOfCells =10; verticalCountOfCells =10; // xml       300dp canvasSize=(int)convertDpToPixel(300, context); mBitmap = Bitmap.createBitmap((int) canvasSize, (int) canvasSize, Bitmap.Config.ARGB_8888); mCanvas = new Canvas(mBitmap); mBitmapPaint = new Paint(Paint.DITHER_FLAG); //  ,       paint =new Paint(); paint.setAntiAlias(true); paint.setDither(true); paint.setColor(0xffff0505); paint.setStrokeWidth(5f); paint.setStyle(Paint.Style.STROKE); paint.setStrokeJoin(Paint.Join.ROUND); paint.setStrokeCap(Paint.Cap.ROUND); //  for(int x=0;x< horizontalCountOfCells +1;x++) mCanvas.drawLine((float)x* canvasSize / horizontalCountOfCells, 0, (float)x* canvasSize / horizontalCountOfCells, canvasSize, paint); for(int y=0;y< verticalCountOfCells +1;y++) mCanvas.drawLine(0, (float)y* canvasSize / verticalCountOfCells, canvasSize, (float)y* canvasSize / verticalCountOfCells, paint); } @Override protected void onDraw(Canvas canvas) { canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint); } // dp   public float convertDpToPixel(float dp,Context context){ Resources resources = context.getResources(); DisplayMetrics metrics = resources.getDisplayMetrics(); return dp * (metrics.densityDpi/160f); } } 

यहाँ मैंने खराब गुणवत्ता वाले कोड के एक छोटे से झटके की अनुमति दी है , कोड में हार्ड-कोडित है जो कि खेल के मैदान की कोशिकाओं को अलग करने वाली लाइनों का रंग और दृश्य का आकार 300 डीपी के बराबर माना जाता है। यह आकार एट्रीब्यूटसेट क्लास के एटरस ऑब्जेक्ट से प्राप्त किया जा सकता है, लेकिन हम कोड को अव्यवस्थित नहीं करेंगे।

इसके अलावा, हम तुरंत स्केच गतिविधि सुनिश्चित करते हैं कि सब कुछ खूबसूरती से खींचा गया है।

 public class GameActivity extends Activity { Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); } } 

और मार्कअप main.xml

 <LinearLayout xmlns:android=«schemas.android.com/apk/res/android» android:orientation=«vertical» android:layout_width=«fill_parent» android:layout_height=«fill_parent» android:background="#aaa" android:gravity=«center_horizontal»> <com.devindi.chain.GameView android:layout_width=«300dp» android:layout_height=«300dp» android:id="@+id/game_view" android:layout_gravity=«center» android:background="#000"/> </LinearLayout> 

इस स्टेप के बाद कोड।

अब चलो खेल के मैदान के पैमाने को बदलने की क्षमता जोड़ते हैं, क्योंकि उनके छोटे आकार के कारण वांछित सेल से अतीत को याद किया जा सकता है। ऐसा करने के लिए, हम अपने GameView वर्ग में OnScaleGestureListener इंटरफ़ेस के ScaleGestureDetector.SimpleOnScaleGestureListener को लागू करने के तरीकों को फिर से परिभाषित करते हैं।

  private final ScaleGestureDetector scaleGestureDetector; private final int viewSize; private float mScaleFactor; public GameView(Context context, AttributeSet attrs) { // xml       300dp viewSize=(int)convertDpToPixel(300, context); mScaleFactor=1f;//    canvasSize=(int)(viewSize*mScaleFactor);//   … scaleGestureDetector=new ScaleGestureDetector(context, new MyScaleGestureListener()); } @Override protected void onDraw(Canvas canvas) { canvas.save(); canvas.scale(mScaleFactor, mScaleFactor);//  canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint); canvas.restore(); } //      MyScaleGestureListener @Override public boolean onTouchEvent(MotionEvent event) { scaleGestureDetector.onTouchEvent(event); return true; } //  ScaleGestureDetector.SimpleOnScaleGestureListener,       //  OnScaleGestureListener private class MyScaleGestureListener extends ScaleGestureDetector.SimpleOnScaleGestureListener { // ""  @Override public boolean onScale(ScaleGestureDetector scaleGestureDetector) { float scaleFactor=scaleGestureDetector.getScaleFactor();//      //    -    float focusX=scaleGestureDetector.getFocusX(); float focusY=scaleGestureDetector.getFocusY(); //               2  if(mScaleFactor*scaleFactor>1 && mScaleFactor*scaleFactor<2){ mScaleFactor *= scaleGestureDetector.getScaleFactor(); canvasSize =viewSize*mScaleFactor;//       //   //         . //  ,     // ,      //        ( ). int scrollX=(int)((getScrollX()+focusX)*scaleFactor-focusX); scrollX=Math.min( Math.max(scrollX, 0), (int) canvasSize -viewSize); int scrollY=(int)((getScrollY()+focusY)*scaleFactor-focusY); scrollY=Math.min( Math.max(scrollY, 0), (int) canvasSize -viewSize); scrollTo(scrollX, scrollY); } //   invalidate(); return true; } } 

परिणाम कोड

कृपया ध्यान दें कि आवर्धन मूल्य की सीमाएं निर्धारित की जाती हैं (वृद्धि 1 से 2 तक होगी), और खेल मैदान को खेल मैदान के बाहर क्षेत्र को दिखाने के लिए एक चेक के साथ ज़ूम बिंदु (उंगलियों के बीच बीच में बिंदु) पर स्क्रॉल किया जाता है। ज़ूम पॉइंट (फोकल पॉइंट) पर स्क्रॉल निम्न प्रकार से किया जाता है - कैनवास की शुरुआत (ऊपरी बाएं कोने) के सापेक्ष फोकल पॉइंट के निर्देशांक की गणना की जाती है, ज़ूम कारक से गुणा किया जाता है और दृश्य के सापेक्ष बिंदु के निर्देशांक घटाए जाते हैं। उसके बाद, हम खेल के मैदान के बाहर स्क्रॉलिंग को रोकने के लिए अंतराल [0, कैनवसाइज -व्यूसाइज़] से निकटतम मूल्य लेते हैं।

अब हम स्क्रॉल, सिंगल टैप और डबल टैप के प्रसंस्करण को लिखेंगे (डबल टैप खेल के मैदान के मूल पैमाने पर लौट आएगा)।

  private final GestureDetector detector; public GameView(Context context, AttributeSet attrs) { ... detector=new GestureDetector(context, new MyGestureListener()); } //      Motion Event' MyGestureListener'  MyScaleGestureListener' @Override public boolean onTouchEvent(MotionEvent event) { detector.onTouchEvent(event); scaleGestureDetector.onTouchEvent(event); return true; } //  GestureDetector.SimpleOnGestureListener,     //    OnGestureListener private class MyGestureListener extends GestureDetector.SimpleOnGestureListener { //  (   ) @Override public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) { //       if(getScrollX()+distanceX< canvasSize -viewSize && getScrollX()+distanceX>0){ scrollBy((int)distanceX, 0); } //       if(getScrollY()+distanceY< canvasSize -viewSize && getScrollY()+distanceY>0){ scrollBy(0, (int)distanceY); } return true; } //   @Override public boolean onSingleTapConfirmed(MotionEvent event){ //  ,    int cellX=(int)((event.getX()+getScrollX())/mScaleFactor); int cellY=(int)((event.getY()+getScrollY())/mScaleFactor); return true; } //   @Override public boolean onDoubleTapEvent(MotionEvent event){ //     mScaleFactor=1f; canvasSize =viewSize; scrollTo(0, 0);//,      . invalidate();//  return true; } } 

परिणाम कोड
एक टैप से, हम उस सेल के निर्देशांक की गणना करते हैं, जिस पर हम टैप करते हैं, उदाहरण के लिए, ऊपरी बाएं सेल में 0,0 निर्देशांक होंगे।

चलो परमाणु ड्राइंग विधि drawAtoms लिखें। विधि पैरामीटर - सेल के निर्देशांक जिसमें हम परमाणुओं का रंग, रंग और संख्या आकर्षित करते हैं।

  void drawAtoms(int cellX, int cellY, int color, int count){ //    float x0=((1f/(2* horizontalCountOfCells))*viewSize+(1f/ horizontalCountOfCells)*cellX*viewSize); float y0=((1f/(2* verticalCountOfCells))*viewSize+(1f/ verticalCountOfCells)*cellY*viewSize); paint.setColor(color); switch (count){ //todo non-absolute values case 1: drawAtoms(cellX, cellY, color, 0);//   mCanvas.drawCircle(x0, y0, 3, paint);//      break; case 2: drawAtoms(cellX, cellY, color, 0); //        mCanvas.drawCircle(x0-7, y0, 3, paint); mCanvas.drawCircle(x0+7, y0, 3, paint); break; case 3: drawAtoms(cellX, cellY, color, 0); //            mCanvas.drawCircle(x0 - 7, y0 + 4, 3, paint); mCanvas.drawCircle(x0 + 7, y0 + 4, 3, paint); mCanvas.drawCircle(x0, y0-8, 3, paint); break; case 4: drawAtoms(cellX, cellY, color, 0); // 4          mCanvas.drawCircle(x0-7, y0-7, 3, paint); mCanvas.drawCircle(x0-7, y0+7, 3, paint); mCanvas.drawCircle(x0+7, y0+7, 3, paint); mCanvas.drawCircle(x0+7, y0-7, 3, paint); break; case 0: //    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR)); //   paint.setStyle(Paint.Style.FILL); //  ,       mCanvas.drawCircle(x0, y0, 17, paint); //   paint.setStyle(Paint.Style.STROKE); paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC)); break; } invalidate();//  } 

फिलहाल, विधि में परमाणुओं के आकार और उनके बीच की दूरी के पूर्ण मूल्यों के रूप में दोष है। इससे क्या हो सकता है? यदि फ़ील्ड का आकार 10x10 से कम है, तो परमाणु छोटे दिखाई देंगे, और एक बड़े क्षेत्र आकार के साथ वे सेल में फिट नहीं हो सकते हैं।

यह स्क्रॉलबार जोड़ने के लिए बना हुआ है। यह प्रक्रिया यहाँ अच्छी तरह से वर्णित है habrahabr.ru/post/120931 ।

गेम लॉजिक के विवरण के साथ आगे बढ़ने से पहले, गेम लॉजिक प्रकार (तर्क का वर्णन करने वाला हमारा वर्ग) नाम लॉजिक के साथ एक वैश्विक चर जोड़ें और एक एकल टैप के प्रसंस्करण विधि में onSingleTapConfirmed जोड़ें
नए परमाणु को जोड़ने की तार्किक प्रक्रिया के भविष्य के तरीके को कॉल करना।
logic.addAtom (cellX, cellY);
इस चर के लिए एक सेटर की भी आवश्यकता होती है।

कोड।

बोध। खेल तर्क।

गेम के तर्क का वर्णन करने वाला गेमलाइजिक क्लास बनाएं। हमें इनर क्लास सेल की भी जरूरत है, जो प्लेइंग सेल के मापदंडों को स्टोर करती है।

  public class GameLogic { private class Cell{ int player=0, countOfAtoms=0;// ,     final int maxCountOfAtoms;//  Cell(int maxCountOfAtoms){ this.maxCountOfAtoms=maxCountOfAtoms; } public int getCountOfAtoms() { return countOfAtoms; } public int getPlayer() { return player; } public void setPlayer(int player) { this.player = player; } public void resetCount() { this.countOfAtoms = 0; } public void addAtom(){ this.countOfAtoms++; } boolean isFilled(){ return this.countOfAtoms == this.maxCountOfAtoms; } } } 

GameLogic वर्ग ही

  private final GameView view; private final GameActivity activity; private int moveNumber=0, currentPlayer=0; private final int COUNT_OF_PLAYERS, BOARD_WIDTH, BOARD_HEIGHT; private final Cell[][] cells; private final int[] colors={0xff1d76fc, 0xfffb1d76, 0xff76fb1d, 0xffa21cfb};//  private final Handler mHandler; public GameLogic(GameView view, GameActivity activity) { this.view = view; this.activity=activity; mHandler=new Handler(); //   ( ,  ) this.COUNT_OF_PLAYERS=2; this.BOARD_HEIGHT=10; this.BOARD_WIDTH=10; cells=new Cell[BOARD_WIDTH][BOARD_HEIGHT]; for(int x=0; x<BOARD_WIDTH; x++){ for(int y=0; y<BOARD_HEIGHT; y++){ if((x==0 || x==BOARD_WIDTH-1) && (y==0 || y==BOARD_HEIGHT-1)){ cells[x][y]=new Cell(2);//    2 }else if((x==0 || x==BOARD_WIDTH-1) || (y==0 || y==BOARD_HEIGHT-1)){ cells[x][y]=new Cell(3);//,    - 3 }else{ cells[x][y]=new Cell(4);// - 4 } } } } //      public void addAtom(final int cellX, final int cellY) { // ,    ,      -   . final Cell currentCell; try{ currentCell=cells[cellX][cellY]; }catch (IndexOutOfBoundsException ex){ return; } //        if(currentCell.getPlayer()==currentPlayer){ currentCell.addAtom(); view.drawAtoms(cellX, cellY, colors[currentPlayer], currentCell.getCountOfAtoms()); //   if(currentCell.isFilled()){ final List<Cell> nearby=new ArrayList<Cell>(4);//   selfAddCell(cellX, cellY-1, nearby); selfAddCell(cellX, cellY+1, nearby); selfAddCell(cellX-1, cellY, nearby); selfAddCell(cellX+1, cellY, nearby); for(Cell nearbyCell:nearby){ nearbyCell.setPlayer(currentPlayer);//     } delayedAddAtom(cellX, cellY-1); delayedAddAtom(cellX, cellY+1); delayedAddAtom(cellX-1, cellY); delayedAddAtom(cellX+1, cellY); //     run() mHandler.postDelayed(new Runnable() { @Override public void run() { //    () currentCell.setPlayer(-1); //  currentCell.resetCount(); view.drawAtoms(cellX, cellY, 0x000000, 0); } }, 1000); return; } }else if(currentCell.getPlayer()==-1){ currentCell.addAtom(); view.drawAtoms(cellX, cellY, colors[currentPlayer], currentCell.getCountOfAtoms()); currentCell.setPlayer(currentPlayer); }else{ return; } } //       private void delayedAddAtom(final int cellX, final int cellY){ mHandler.postDelayed(new Runnable() { @Override public void run() { addAtom(cellX, cellY); } }, 1000); } //   target   private void selfAddCell(int cellX, int cellY, List<Cell> target){ try{ target.add(cells[cellX][cellY]); }catch (IndexOutOfBoundsException ignore){} } 

कोड।

यहाँ हम एक निर्माणक को देखते हैं जो सेल ऑब्जेक्ट्स का एक दो-आयामी सरणी बनाता है और addAtom पद्धति, जिसे एकल टैप दृश्य से और खुद से कहा जाता है, बशर्ते कि सेल परमाणुओं से नेत्रगोलक तक भर जाता है।
अब आप परमाणुओं को कोशिकाओं में जोड़ सकते हैं, और जब कोशिका में परमाणुओं की एक महत्वपूर्ण संख्या जमा होती है, तो वे एक सेकंड में अलग हो जाएंगे। हालांकि, अब इस दूसरे के दौरान आप परमाणु जोड़ सकते हैं। इस से हटाएं आइलॉक फ्लैग वैरिएबल और आईलॉक (), लॉक (), और अनलॉक () गेमव्यू वर्ग के तरीकों को जोड़कर।

चाल के बाद एक खिलाड़ी परिवर्तन जोड़ना भी आवश्यक है, खेल के अंत में स्कोरिंग और प्रसंस्करण (जब सभी परमाणु एक खिलाड़ी से संबंधित होते हैं और प्रत्येक खिलाड़ी कम से कम 1 चाल चलता है)।
AddAtom () विधि के अंत में निम्नलिखित कोड जोड़ें

  int[] score=scoring(); if(moveNumber==0){ endTurn(score); }else { //   .      endTurn()   //       int losersCount=0; for(int i=0; i<COUNT_OF_PLAYERS; i++){ if(score[i]==0) losersCount++; } if(losersCount+1==COUNT_OF_PLAYERS){ isEndGame=true; } if(!mHandler.hasMessages(0)){ view.unlock(); endTurn(score); } } } //   private void endTurn(int[] score){ if(!isEndGame){ if(currentPlayer == COUNT_OF_PLAYERS-1){ moveNumber++; currentPlayer=0; }else { currentPlayer++; } }else{ activity.endGame(currentPlayer, score[currentPlayer]); } // ,  ,   ,      activity.setMoveNumber(moveNumber); activity.setPlayerName(currentPlayer); activity.setScore(score); } //  int[] scoring(){ int[] score=new int[COUNT_OF_PLAYERS]; for(int x=0; x<BOARD_WIDTH; x++){ for(int y=0; y<BOARD_HEIGHT; y++){ if(cells[x][y].getPlayer()!=-1){ score[cells[x][y].getPlayer()]+=cells[x][y].getCountOfAtoms(); } } } return score; } 

पूरा कोड
यह विधियों के कार्यान्वयन को लिखने के लिए बनी हुई है

  void setPlayerName(int playerID){} void setScore(int[] score){} void setMoveNumber(int moveNumber){} void endGame(int winnerID, int score){} 

यह होमवर्क होगा। यहां सब कुछ तुच्छ है।

विधानसभा के बाद, फ़ाइल

अगला, आपको गेम को अनुकूलित करने के लिए गतिविधि के रूप में परिणामी एप्लिकेशन को थोड़ा समाप्त करने की आवश्यकता है (खेल के मैदान का आकार, खिलाड़ियों की संख्या, परमाणुओं का रंग और खिलाड़ियों के नाम, लेकिन यह इस लेख का विषय नहीं है। आप गीथब पर अंतिम कोड देख सकते हैं, Google Play पर परिणामी गेम को आज़मा सकते हैं।

मुझे उम्मीद है कि यह लेख किसी की मदद करता है।
मैं आपसे बड़े पत्थर नहीं फेंकने के लिए कहता हूं। मैं कोड की निम्न गुणवत्ता को स्वीकार करता हूं और गंदगी से बचने का प्रयास करने का वादा करता हूं। आपका ध्यान देने के लिए धन्यवाद।

PS यह मेरा हैबर पर पहला लेख है।