ysfzrn

//src/components/segment.js
import React, { Component } from "react";
import { View, Text, StyleSheet } from "react-native";
import SharedStyle from "../utils/sharedStyle";
// create a component
class Segment extends Component {
  render() {
    const customStyle = {
      left: this.props.x,
      top: this.props.y

ysfzrn

//src/stores/gameStore.js
const segmentRate = 10; // yılanın her hareketinde katedeceği mesafe
const boardWidth = SharedStyle.board.width;
const BoardHeight = SharedStyle.board.height - 10;
let globalID;
...
 @action("Snake is moving")
  handleMoveSnake =() => {
    let temp = _.cloneDeep(this.snake.slice());  
      this.lastSegment = temp[0];

ysfzrn

// src/stores/gameStore.js
class GameStore {
  ...
  @observable food = { x: 50, y: 50 }; //elmanın başlangıçta belireceği yer.
  ...
  @action("make food")
  handleMakeFood() {
    const frameX = (boardWidth -10) / segmentRate;
    const frameY = BoardHeight / segmentRate;
    this.food.x = this.getRandomInt(0, frameX) * segmentRate;

ysfzrn

...
       <Board>
         {snake.map((segment, i) => {
            return <Segment key={segment.id} id={segment.id} x={segment.x} y={segment.y} />;
          })}
          <Food x={ gameStore.food.x } y={ gameStore.food.y }/>
        </Board>  
       ...

ysfzrn

@action("Did the snake eat the food ?")
  handleEatFood() {
    if (this.snake[0].x === this.food.x && this.snake[0].y === this.food.y) {
      this.score = this.score + 1;
      this.snake.push({
        id: this.snake[this.snake.length - 1].id + 1,
        x: this.snake[this.snake.length - 1].x,
        y: this.snake[this.snake.length - 1].y
      });
      if( this.score % 3 === 0 ){

ysfzrn

//src/stores/gameStore.js
...
class GameStore{
   ...
  @action("Snake is moving")
  handleMoveSnake =() => {
      ...
     //isGameOver control
      for(let i = 1; i < this.snake.slice().length; i++){
      if(this.snake[0].x === this.snake[i].x && this.snake[0].y === this.snake[i].y ){

ysfzrn

//src/stores/gameStore.js
...
class GameStore{
   ...
  @action("restart handler")
  handleRestart(){
    NavigationStore.handleChangeRoute('gameScreen');
    this.intervalRate = 5;
    this.currentDirection = "right";
    this.lastSegment = 10;

ysfzrn

import React from "react";
import styled, { keyframes } from "styled-components";
import { observer } from "mobx-react";
import { detectmob } from "../utils/sharedStyle";
import { List, AutoSizer } from "react-virtualized";

let ClickOutComponent = require("react-onclickout");

const ArrowDown = require("../public/assets/arrow-down.png");
const isMob = detectmob();

ysfzrn

-- Firstly, remove PRIMARY KEY attribute of former PRIMARY KEY
ALTER TABLE <table_name> DROP CONSTRAINT <table_name>_pkey;

-- Then change column name of  your PRIMARY KEY and PRIMARY KEY candidates properly.
ALTER TABLE <table_name> RENAME COLUMN <primary_key_candidate> TO id;

ysfzrn

function transformOrigin(matrix, origin) {
  const { x, y, z } = origin;

  const translate = MatrixMath.createIdentityMatrix();
  MatrixMath.reuseTranslate3dCommand(translate, x, y, z);
  MatrixMath.multiplyInto(matrix, translate, matrix);

  const untranslate = MatrixMath.createIdentityMatrix();
  MatrixMath.reuseTranslate3dCommand(untranslate, -x, -y, -z);
  MatrixMath.multiplyInto(matrix, matrix, untranslate);