Mobile development

Developing for mobile

Before starting to read this post, I have to warn you that I zapped so informations about mobile development because I just wanted to firstly focus on my opinion about the differents ways to make an app (not a nap !)… I will never mention Windows Phone Development not because I don’t like Windows, just because I never did such apps for this OS.

Introduction

Nowadays, developping for mobile is… MANDATORY. Almost.

Whether it is for a website or a simple software, the companies needs to be responsive and to fit to the mobile generation. Indeed, if you’re not going to make an application, you may think that mobile developpement is none of your business and this is so wrong since if you need to create a web site, it has to be responsive…

why

Smartphones, tablets, smartwatches… The ways to communicate and to interact with each others have changed and keep going to change…

Anyway, today I’m here to talk about developing mobile applications not about developing responsive web sites.

android_vs_ios

Android or iOS ?

And by developing mobile applications, I’m talking about Android and iOS development (mostly Android)

The differents ways…which one is the best ?

The classical way

Either on Android or iOS (and of course Windows Phone… ahem…), you can create your apps with « native » languages. This is called native development. I personnally think that using the term « native » is so wrong in so many levels within the context of developping Android app with Java. Actually, if you want to go really deep in native development in Android, you shall use C/C++ and then you’re really doing native…

Anyway, if you want to take this path, you will have to develop for each platform in differents languages :

  • Android : Java with the SDK or C/C++ with the NDK
  • iOS : Objective-C or Swift (since 2014)
  • WP : C# & .NET

Hybrid development

When the possibility to make web app appeared, it made cleary possible to develop with simple languages as HTML, CSS and JS. But why settle for the web app development ? Then came the hybrid development. The idea is simple : make a web app, wrap it with some cool stuffs (to allow the access of the smartphone’s functionnalities for example) and at the end « compile » to obtain a native app. A quick search with your favorite search engines will give you the most used hybrid frameworks.

Outsiders

I called them outsiders because if they offers you the possibility to develop in native language (C++ or C#), it doesn’t really work like native developpement and doesn’t offer the same opportunities. Those outsiders are Qt and Xamarin.

My feelings about that

Once upon a time, a programmer discovered Android Native Dev…

Three years ago, I learned on an expedited time frame the mobile development for Android during my studies. This year, still in the same context, I have the opportunity to work again on it and… wow… How things have changed ! Indeed, I should have expected that changes but… still !

I’m sad to hear that Eclipse plug-in (made by Google) called ADT has been abandonned in profit of a new IDE called Android Studio, developped by JetBrains. If you didn’t know, JetBrains develops a lot of IDE and each IDE are specific to a language e.g IntelliJ are made for Java development, PHPStorm for PHP dev, and so on. As all the IDE from JetBrains, Android Studio has a obviously similar interface (same editor, so same engine, etc.) but is really made for Android development. The nicest feature improved and given in this editor (even if the preview mode sometimes doesn’t work well) is the UI design mode with templates quickly available to get a nice interface quickly and be able to devote fully to the code. By the way, when you create a new project, to keep you focused on coding and not designing, you can choose the pre-made templates…

This is nice but it doesn’t make forget the heaviness of work : on one side the Java programming and XML coding on the other side… And also trying to not lose yourself in the different IDs of each elements… To be honest, developping in Java + XML sometimes upsets me because it is tedious… Not difficult but tedious…

tumblr_maaec25jog1ruuum2

Me after a day of coding … one page of an application

Well, on the other side, native development in this context is great, you can focused on the code and not on the design or compatibilty problems.:)

I’ve just started iOS class…So… I will update or write another article for the iOS… Sorry:/ (But I think that it is not so different than Android)

The biggest (and obvious) problem is still the obligation to develop in differents languages for each OS… And if you’re affraid to code redondantly for each OS… There’s a solution : Hybrid App.

Spirit of Webdesigner

The Motto of Hybrid Dev is quite a reminder of Lord of the Rings to me : One language to every OS. To be honest, I’ve invented this motto while I was writing this post, but it is clearly the aim of hybrid development.

As I always loved developing web sites with the magic trio HTML/CSS/JS, it is a waaaay easier for me to create some stuning apps ! Not too long ago, I chose to develop some projects with Ionic Framework which let me more freedom to code and design the app. For example, with the CSS, I could easily have customized buttons. Using Ionic brings you AngularJS and Cordova which means that you can make app easily, quickly and less expensive (in money but also in time). I could make you a pretty prototype within three hours !ūüėģ

So the difference ? What you want to do ! Because there are some limitations with the hybrid development… Aaaaand this is the perfect moment to have a glance at the third wheel : the Outsiders. *tadaaaam*

Cute

I had a glance at Qt (pronounced « Cute »).

Qt is mixing everything (C++, JS, QML…) and the result is quite nice ! You can develop in C++ with some style in QML, or just do your code in QML, or QML and JS… Everything’s possible. It is designed to be fully multi platform ! (not only Android, iOS but also Desktop software…). QML is a genuinely language, simple as ABC.

I did not practice a lot until today, but I’m pretty seduced by Qt. If Ionic won’t fit to my expectations, I’ll start to work with Qt.

The weak point of Qt (to me) is the size it takes on the hard drive (almost 10 Go…!). Beside this weak point, don’t forget that Qt exists for a long time as it has been originally created to make GUI with C++ and Python (PyQT).

There is also Xamarin, recently bought by Microsoft. Xamarin is based upon Mono (at least it was at the beginning) and it uses the C# language. I don’t know if it is interesting, but it is the actual trendy software to develop cross-platform applications…

Of course there are plenty softwares, editors, etc. such as Windev to develop cross-platform app… But I don’t think I’ll try all of them !

May this article will help you in your Quest of Making A Stunning App !

En passant

Les br√®ves de nerdycode

Ninn : Ninn Is Not Notepad

√áa y est, j’ai enfin commenc√© le d√©veloppement de Ninn !

Késako

J’en parlais ici et ici. Pour ceux qui veulent gagner du temps, voici le topo : cr√©er un √©diteur de texte.

Pourquoi ce projet ?

√Ä l’√©poque, o√Ļ j’ai commenc√© √† penser √† cr√©er un √©diteur de texte, je d√©butais en informatique. Le but du projet √©tait d’apprendre le java, du moins √† la base. √Čtant tr√®s pris dans ma scolarit√©, j’ai mis¬†de c√īt√© ce projet sans pour autant l’oublier. En 2013, je me suis re-pench√© dessus ¬†afin d’√©tablir un bref cahier des charges du logiciel.

2014 fut une ann√©e tr√®s compliqu√©e, donc une fois de plus j’ai report√© la mise en d√©veloppement.

J’ai enfin pu coder quelques lignes de code pour sortir une version alpha (vraiment tr√®s alpha…).

Pourquoi j’en parle du coup (vu qu’il est m√™me pas termin√©) ?

Il me semblait important de noter cette √©volution dans ce projet (qui n’aboutira peut-√™tre pas:/ ). Cette version alpha repose sur tous mes acquis de ces 3 derni√®res ann√©es, donc je suis plut√īt content de voir que j’ai √©volu√©.ūüėÄ

Oui, je me la p√®te (un chou√Įa)

En 2012, une version alpha¬†de ce type, je l’aurais sortie tr√®s probablement en 1 mois (voire plus), et l√† une √† deux semaines m’auront suffit !

Dans les détails

Pour le moment, le logiciel est sous creative commons BY-SA. Je commencerais à réfléchir plus sérieusement à la legislation quand le projet sera devenu un peu plus important.

Je ne donne pas encore plus de d√©tails sur les caract√©ristiques sp√©cifiques √† Ninn d√©velopp√©es ou √† d√©velopper de l’√©diteur car je veux garder √ßa pour moi pour le moment. Seules les fonctionnalit√©s de base ont √©t√© pour le moment ajout√©es; √† savoir : Ouvrir un fichier texte, √©crire un fichier texte…

Ne l’oublions pas, je fais √ßa pour le fun. Il n’est pas question de proposer un logiciel aussi performant que Sublime Text ou Atom.

Les premi√®res versions ont √©t√© donc faites en Java en Ao√Ľt 2015, vous pouvez t√©l√©charger tout √ßa ici : Ninn, le site¬†(au design tr√®s sobre, en effet). Peut-√™tre que je coderais le projet dans un autre langage (du type C++) ou bien avec une techno du type Qt (et son super langage QML).

Qt

Que je prononce, et que je prononcerais √† jamais, « KuT√© » [1]

J’ai commenc√© √† regarder sans trop me presser Qt et le QML. Tr√®s bon langage. Du tr√®s tr√®s lourd !! Je reviendrais certainement l√†-dessus.

[1] Qt se prononce « Quioute » (Cute en anglais).

En passant

Les br√®ves de nerdycode

Des sous-titres pour tous

soapclub_logoSur¬†SoapClub, je vous invite √† lire mon article sur l’importance des sous-titres sur youtube et internet.


Pourquoi j’en parle ?

Tout est expliqu√© dans l’articleūüėČ

Les ebooks

Souvenez-vous dans le dernier num√©ro des br√®ves de nerdycode, je parlais d’un petit projet personnel que j’essaie de mettre en place. Eh bien, voici une version alpha du projet, rien d’√©loquent en soi, mais cela pose les basesūüėÄ

Capture d’écran 2015-03-27 à 10.45.51

(Cliquez sur l’image pour acc√©der au site)

Voil√†, voil√† c’est tout pour aujourd’hui !:)

Un peu de maths : les puissances 2/2

Suite du post Un peu de maths : les puissances part.1
Petit rappel sur les règles de la puissance :

  • x^0 = 1.
  • x^y = x^(y/2)*x^(y/2) si y est pair.
  • x^y=x^(y-1)*x sinon.

Le petit programme qui suit demande deux valeurs (x et i) et calcule x puissance i :

import java.util.Scanner;

class puissance{
  static double puissance(double x,int n){
    double reponse;
    if (n==0) {
      reponse=1;
    }else{
      reponse=puissance(x,n/2);
      if(n%2==0){
        reponse=reponse*reponse;//pair
      }else{
        reponse=reponse*reponse*x;//impair
      }
    }
    return reponse;
  }
  public static void main(String[] args) {
    double x;
    Scanner lectureValeur = new Scanner(System.in);
    System.out.print("Valeur de x : ");
    x=lectureValeur.nextDouble();
    System.out.print("Puissance demandee : ");
    i=lectureValeur.nextInt();
    System.out.println(x+"^"+i+" = "+(int)(puissance(x,i)));
  }
}

Résultat sur le terminal :

nerdyprog@nerdycode ~ $ javac puissance.java
nerdyprog@nerdycode ~ $ java puissance
Valeur de x : 2
Valeur de i : 2
2.0^2 = 4

Le deuxieme petit programme permet d’√©crire un calcul de la forme 2^2 et effectue le calcul :

import java.util.Scanner;

class puissance2{
  static double puissance(double x,int n){
    double reponse;
    if (n==0) {
      reponse=1;
    }else{
      reponse=puissance(x,n/2);
      if(n%2==0){
        reponse=reponse*reponse;//pair
      }else{
        reponse=reponse*reponse*x;//impair
      }
    }
    return reponse;
  }
  public static void main(String[] args) {
    double x=0;
    String calcul;
    int j=0, k=0, n=0;
    Scanner lectureEntre = new Scanner(System.in);
    System.out.print("Calcul à effectuer : ");
    calcul=lectureEntre.nextLine();
    for (int i=0; i<calcul.length(); i++) {
      if(calcul.charAt(i)!='^'){
        j=i+1;
        k=j+1;
      }else{
        break;
      }
    }
    x=Double.parseDouble(calcul.substring(0,j));
    n=Integer.parseInt(calcul.substring(k,calcul.length()));
    System.out.println(x+"^"+n+" = "+(int)(puissance(x,n)));

  }
}

Résultat sur le terminal :

nerdyprog@nerdycode ~ $ javac puissance.java
nerdyprog@nerdycode ~ $ java puissance
Calcul à effectuer : 2^2
2.0^2 = 4

 

Bien coder c’est coder proprement

Je suis tombé précédemment sur une présentation faite par Jean-Baptiste Nizet, informaticien chez NinjaSquad : https://speakerdeck.com/jnizet/5-apprentissages-pour-le-programmeur-debutant

J’ai trouv√© int√©ressant de rebondir l√†-dessus vu mon dernier post. Je reviens donc sur cette pr√©sentation et je pr√©sente mon point de vue. En clair, je commente cette pr√©sentation:-)

1 – Indentez votre code

Oui, comme le dit JB Nizet, l’indentation est promordial en programmation. Sur ce point, rien √† dire. C’est comme si j’√©crivais ce post sans accents, sans ponctuation. Ce serait illisible ! (Pour faire hype, branch√©, √† la mode, on emploiera le terme refactoring).

2 – Erreurs et trace de bugs

La plupart des √©tudiants en informatique ne lisent pas ces traces d’erreurs car c’est un bloc illisible √† premi√®re vue ! Puis m√™me apr√®s avoir pris l’habitude de lire ces traces d’erreur, voire avoir pris l’habitude d’utiliser le d√©bugueur de l’IDE, √ßa reste chiant ce gros pav√©.

Que ce soit Eclipse ou IntelliJ (je suis agnostique l√†-dessus en ce qui concerne ces usines √† gaz, pas de pr√©f√©rences), l’apprentissage reste faible. Les gens vont aller sur google et recopient la trace d’erreur et avec un peu de chance, ils trouveront une tentative de r√©solution sur StackOverflow…

3 – La documentation c’est pour les rigolos

Google c’est magique. Encore plus si vous fa√ģtes votre recherche : 1) en anglais 2) avec des mots-cl√©s.

Personnellement, je trouve que la documentation c’est utile, mais de temps en temps c’est vachement pas tr√®s instructif et √ßa n’aide pas tout le temps. Surtout en d√©veloppement web quand vous utilisez des frameworks et autres librairies.

Donc le RTFM [1], c’est gentil mais d√®s fois pour des cas complexes ce serait plut√īt LMTGTFY [2] !ūüėõ

4 – Killing the name of

J’en ai d√©j√† parl√© pr√©cedemment. Les variables foor, bar, toto, c’est cool quand vous testez pour vous-m√™me. Les variables qui n’ont aucun sens c’est √† proscrire. De m√™me pour les variables trop verbales. Surtout en Java ! Oui Java est d√©j√† tellement verbeux alors si vous en rajoutez une couche…

5 – Throws, catch…

Je ne suis pas encore un expert dans tous les langages mais à vue de nez ça sent le Java !

Je profite de ce cinquième point pour faire une parenthèse sur Java.Java ne sera jamais mon langage préféré pour plusieurs raisons.

La première : Il est trop verbeux.

Un exemple :

Capture d‚ÄôeŐĀcran 2014-07-03 aŐÄ 16.20.53

La deuxième : Les exceptions.

Pour un d√©butant voire quelqu’un qui a au minimum un an d’exp√©rience en Java (voire deux dans mon cas), les exceptions c’est un autre monde.

La troisième : Un langage objet devrait être simple.

Je n’ai pas encore manipul√© d’autres langages objets jusqu’√† pr√©sent mais je reste persuad√© que le langage objet fut cr√©√© tout d’abord pour simplifier la programmation. Il faudrait comparer Java avec le langage C++ ou encore le langage Objective-C. Mieux encore ! Avec le langage Smalltalk !

Il y a d’autres raisons, mais ce sont les principales. Java n’en reste pas moins un langage int√©ressant mais il est loin d’√™tre le meilleur √† mon go√Ľt.

En passant

Les br√®ves de nerdycode

Petite mise au point autour de SoapClub

J’avais durant mes jeunes ann√©es un blog « personnel » que j’avais d√©laiss√© au profit de celui-ci. √Čtant donn√© ma lenteur l√©gendaire pour sortir un ou deux articles (que je juge plut√īt assez complets pour la plupart, mais √ßa c’est mon avis), il est tout √† fait compr√©hensible que SoapClub fut d√©laiss√©.

Pourquoi j’en parle du coup ?

Parce que j’ai d√©cid√© de reprendre tout √† partir de z√©ro, from scratch comme dirait les informaticiens. Quelques articles restent pour prouver que ce blog n’est pas si jeune que √ßa, mais j’essaierai de rehausser le niveau « intellectuel » de ce blog (oui, j’ai honte de certains articles de ce blog, d’ailleurs certains ont √©t√© supprim√©s). Il y a √©galement une « refonte » du design du blog (il y en aura s√Ľrement une aussi pour nerdycode) au niveau du logo ainsi que du style choisi.

soapclub_logo

Et nerdycode dans tout ça ?

L’id√©e est que SoapClub reste tr√®s en retrait (du moins) vis √† vis de l’univers informatique donc nerdycode (qui a deux ans et quatre mois maintenant d’ailleurs) reste toujours l√†. Peut-√™tre m√™me bien que j’√©crirais d’avantage (qui sait ?:mrgreen: )

Des ebooks en cours de rédaction

C’est un petit projet personnel que j’essaie de mettre en place. Rien d’exceptionnel. L’id√©e est que comme j’aime √©crire et faire de l’informatique, j’ai envie de partager un peu mes connaissances sous forme d’ebooks. Il y aura s√Ľrement des articles de ce blog qui appara√ģtront sous forme d’ebooks. Le c√īt√© b√©n√©fique pour moi sera la mise en place de la plateforme de t√©l√©chargement des ebooks √† l’aide de technos web dernier cri (oui cela me permettrait de mettre en pratique ce que je sais faire avec ces nouvelles technos).

Seront-ils gratuits ?

Oui, ils seront gratuits. D’une part parce que le contenu des ebooks n’apportera rien de bien nouveau vis √† vis du dense contenu que vous trouverez sur Internet. D’autre part, car je n’ai pas envie de me casser les pieds √† mettre en place un syst√®me de payement.

Il y aura quoi au menu ?

Je n’ai pas encore anticip√© tout le contenu. Il y aura s√Ľrement une collection « Web Dev » qui traite de tout ce qui a un rapport avec le d√©veloppement web, une collection « From scratch »qui sera une suite de ebooks portant sur divers sujets, et des annexes.

Voici un bref aper√ßu du d√©but d’un des premiers ebooks r√©dig√©s (√† chaud) :

Capture d‚ÄôeŐĀcran 2014-07-03 aŐÄ 20.28.39

Coder proprement

2035041015-0

Je ne serais ni le premier, ni le dernier √† vous parler de code propre, vous en conviendrez. Si je suis venu parler de ceci c’est parce que je suis en train de lire l’int√©ressant livre de Robert C Martin : « Coder proprement ». J’adh√®re sur certains propos que j’ai pu lire dans ce livre et j’avais envie de partager sur la toile mon avis √† ce propos. *trop excit√©*

original

Qu’est-ce un code propre ?

Un code propre est :

  • un code lisible
  • un code simple
  • un code bien pens√©/r√©fl√©chi
  • un code minimal si possible
  • un code am√©liorable par n’importe qui

Le fond c’est bien, mais la forme √ßa aide.

Un code indent√© est toujours plus beau qu’un code non indent√© ou mal indent√©. J’en veux pour preuve la norme de l’√©cole fran√ßaise r√©put√©e¬†: l’Epitech. J’ai un copain qui y est et qui m’avait racont√© que d√®s la premi√®re ann√©e, il vous impose une norme d’√©criture. Si vous cherchez un peu sur Google, vous trouverez des bribes concernant cette norme. Elle apprend aux √©l√®ves √† √©crire du bon code (Il y a un autre raison √† cette norme, mais l√† n’est pas le sujet).

Quand vous codez, fa√ģtes comme si quelqu’un irait lire votre code apr√®s et que vous ne serez pas √† ses c√īt√©s. En entreprise ce sera tr√®s certainement le cas. Le code sera maintenu par quelqu’un d’autre que vous.

Vous √™tes une sorte d’√©crivain, vous √©crivez un roman, pour vous mais surtout pour les autres.

Un code propre c’est un bon code.

Je ne suis pas un programmeur expert, mais ma faible exp√©rience me permet d√©j√† d’adh√©rer √† ces propos ! Combien de fois j’ai pu voir un code illisible bien qu’efficace ? Pour compl√©ter la d√©finition de code propre, je devrais rajouter qu’on devrait mettre un maximum de commentaires, pas forc√©ment de faire un pav√© digne de Guerre et Paix, mais une phrase explicite. L’anglais est effectivement le langage de rigueur. Je m’explique :

A titre d’exp√©rience, j’ai travaill√© sur un projet scolaire de logiciel de dessin vectoriel simplifi√© avec deux coll√®gues. Le projet est visible sur un¬†compte github. Durant le projet, j’ai pu jauger le niveau de mes deux coll√®gues. L’un √©tait tr√®s tr√®s fort, l’autre aussi bon que moi. Celui qui √©tait tr√®s fort on va l’appeler Jacques, et celui qui l’√©tait moins Michel. On a boss√© en √©quipe et on s’est ramass√© un 20/20.ūüėÄ

auiomd

Bon, d’accord j’avoue j’ai choisi mes mots pour placer cette vanneūüėÄ

Jacques √©tait tr√®s fort donc assez rapide √† nous fournir du code. Son premier jet fut quasi illisible sauf pour lui. Mais pas seulement son premier jet en fait : peu √† peu on avan√ßait dans le projet, ses variables restaient parfois un myst√®re. Avec un peu de bon sens, j’arrivais √† comprendre (mais pas tout) son code. Ce qui n’√©tait, h√©las, pas le cas de Michel¬†!

49446854

Peut √™tre bien que Jacques trouvait compr√©hensible d’√©crire private Coord mse = new Coord(0,0); les coordonn√©es de la souris (mse > mouse), mais ce n’est pas forc√©ment le cas pour nous autres¬†!

Bon attention quand m√™me √† ne pas non plus √† faire trop long comme nom de variable¬†! private Coord coordinatesOfTheMousePointerWeUseOnCanvas = new Coord(0,0); C’est un poil trop verbal. Pr√©f√©rez par exemple¬†: private Coord coordMouse = new Coord(0,0);

Chacun √† sa fa√ßon d’√©crire, bien entendu. Mais il n’en reste pas moins qu’il vous incombe la responsabilit√© d’√™tre compr√©hensible.

Toujours sur ce m√™me projet, j’ai pris l’habitude de toujours commenter mon code. Je n’en suis pas peu fier !ūüėÄ Ce qui n’√©tait pas le cas de mes coll√®gues !

49447312

Franchement, c’est tr√®s probablement la deuxi√®me raison pour laquelle Michel √©tait perdu. (Du coup, comme on devait rendre un projet comment√©, on a pass√© nos deux nuits blanches pour tout commenter…Merci les copains! Les joies du code).

En r√©sum√©, si vous revenez dans 3 mois sur votre code, et que cela vous semble pas tr√®s compr√©hensible du premier coup d‚ÄôŇďil, peut-√™tre que vous avez mal √©crit vos variables, ou que les commentaires sont pas tr√®s utiles √† la compr√©hension. D’un coup c’est moins parlant. D’o√Ļ¬†: un code propre, c’est un bon code.

Scout toujours, scout un jour !

Le-film-Quand-Gerard-Jugnot-joue-au-chef-scout-sur-W9-a-20h50_portrait_w674

Un truc qui m’a « marqu√© » dans ce livre c’est ce proverbe de scout¬†: ¬ę¬†Laissez le campement plus propre que vous ne l‚Äôavez trouveŐĀ en arrivant¬†¬Ľ
Rien à dire, tout y est dit:mrgreen:

Nan s√©rieusement, j’ai eu √† un moment reprendre du code, quand j’ai vu le truc √ßa voil√†¬†ma r√©action :

49447308

Le boulot est donc comme le dit la citation tr√®s illustrative, rendez √ßa propre. Et normalement, celui qui est pass√© avant vous devrait vous filer du code un peu pr√®s propre, et celui qui passera apr√®s vous aura un code encore plus propre. On partage notre code en communaut√©. C’est quasi communiste comme mode de pens√©e ahah…

Head in HandsNulle la blague.

 

Allez, conclusion h√Ętive (vachement m√™me)

Je n’ai pas fini de lire le livre, certaines choses me d√©passent encore, mais il est clair que c’est un ouvrage tr√®s int√©ressant √† avoir dans sa biblioth√®que¬†!:)

Je vous ai expos√© les principales lignes, les plus importantes quoi, pour vous mettre l’eau √† la bouche *splash*

BONUS (parce que je savais o√Ļ le caser)

Code Simple de Beck (vu dans le livre) :

Par ordre de priorité, un code simple :

  • passe tous les tests ;
  • n’est pas redondant
  • exprime toutes les id√©es de conception pr√©sentes dans le syst√®me
  • minimise le nombre d’entit√©s, comme les classes, les m√©thodes, les fonctions et assimil√©es

Pacman : allons plus loin

gamejava

Pr√©c√©demment, nous avions vu comment dessiner Pacman et le faire d√©placer. Cette fois, nous allons essayer de le d√©placer √† l’aide des fl√®ches du clavier !:)

Voici le code :

package Pacman;
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.event.KeyListener;
import java.awt.event.KeyEvent;
import javax.swing.JFrame;

public class Jeu extends JFrame implements KeyListener{

	private int compteur ;

	/* PACMAN COLORS */
	Color couleur1, couleur2;

	/* COORDINATES */
	public int x=10;
	public int y=30;

	/* DEFAULT COORDINATES */
	public final int X_INIT=10;
	public final int Y_INIT=30;

	/* DIRECTION */
	/*H : 1 B : 2 D : 3 G : 4*/
	public int direction = 0, nb;

	public boolean test=false;

	/* LIMITS */
	public final int X_MIN = 10;
	public final int X_MAX = 440;
	public final int Y_MIN = 30;
	public final int Y_MAX = 440;

	public Jeu(String titre, int largeur,int hauteur,int posX,int posY) {
		super(titre);
		setSize( largeur, hauteur );
		setVisible( true );
		this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		this.setLocation(posX,posY);
		couleur2 = Color.yellow;
		addKeyListener(this);
	}

	/* METHODS KEYLISTENER */
	@Override
	public void keyPressed(KeyEvent e) {
		// TODO Auto-generated method stub
		switch (e.getKeyCode()){
			/* HAUT */
			case KeyEvent.VK_UP :
				//y=y-10;
				direction=1;
				System.out.println("HAUT");
				break;
			/* BAS */
			case KeyEvent.VK_DOWN :
				//ver = 3;
				//y=y+10;
				direction=2;
				System.out.println("BAS");
				break;
			/* DROIT */
			case KeyEvent.VK_RIGHT :
				//ver = 1;
				//x=x+10;
				direction=3;
				System.out.println("DROIT");
				break;
			/* GAUCHE */
			case KeyEvent.VK_LEFT :
				//ver = 4;
				//x=x-10;
				direction=4;
				System.out.println("GAUCHE");
				break;
			default :
				System.out.println(e.getKeyCode());

		}

	}

	@Override
	public void keyReleased(KeyEvent arg0) {
		// TODO Auto-generated method stub

	}

	@Override
	public void keyTyped(KeyEvent arg0) {
		// TODO Auto-generated method stub

	}

	/* METHOD ANIMATING PACMAN */
	public void animer (int nbr_mouvement){
		nb=nbr_mouvement;
		for (compteur=0; compteur<nb; compteur++) {
			this.repaint();
			try {
				Thread.sleep(100);//pause between each pics.
			}
			catch (InterruptedException e) {
				e.printStackTrace();
			}
			nb++; // INFINI

		}
	}
	/* DRAWING METHOD */
	public void paint (Graphics g){
		/* BACKGROUND */
		g.setColor( Color.white);
		g.fillRect(0,0,500,500);

		Graphics2D g2 = (Graphics2D)g;

		/* COLOR ALTERNING */
		if (compteur%2==0){
			couleur1 = Color.yellow;
		}else{
			couleur1 = Color.white;
		}
		/* DRAW PACMAN ACCORDING THE DIRECTION CHOSEN */
		if(direction==0){
			x=x+10;
			g.setFont(new Font("Serif",Font.ITALIC,50));
			g.setColor(Color.ORANGE);
			g.drawString("PACMAN",150,250);
			g.setFont(new Font("Serif",Font.ITALIC,20));
			g.drawString("by A.RAVAUX",150,270);
			g.setColor( couleur1);
			g.fillArc(x, y, 50, 50,0, 360);
			g.setColor( couleur2);
			g.fillArc(x,y, 50, 50, 30, 280);
			g.setColor(Color.DARK_GRAY);
			g.fillArc(x+25, y+5, 7,7,0, 360);
		}else if(direction==1){
			y=y-10;
			g.setColor( couleur1);
			g.fillArc(x, y, 50, 50,0, 360);
			g.setColor( couleur2);
			g.fillArc(x, y, 50, 50,135, 250);
			g.setColor(Color.DARK_GRAY);
			g.fillArc(x+10, y+20, 7,7,0, 360);

		}else if(direction==2){
			y=y+10;
			g.setColor( couleur1);
			g.fillArc(x, y, 50, 50,0, 360);
			g.setColor( couleur2);
			g.fillArc(x, y, 50, 50,240, -290);
			g.setColor(Color.DARK_GRAY);
			g.fillArc(x+10, y+20, 7,7,0, 360);
		}else if(direction==3){
			x=x+10;
			g.setColor( couleur1);
			g.fillArc(x, y, 50, 50,0, 360);
			g.setColor( couleur2);
			g.fillArc(x,y, 50, 50, 30, 280);
			g.setColor(Color.DARK_GRAY);
			g.fillArc(x+25, y+5, 7,7,0, 360);
		}else if(direction==4){
			x=x-10;
			g.setColor( couleur1);
			g.fillArc(x, y, 50, 50,0, 360);
			g.setColor( couleur2);
			g.fillArc(x, y, 50, 50,140, -280);
			g.setColor(Color.DARK_GRAY);
			g.fillArc(x+25, y+5, 7,7,0, 360);
		}
		if(x==X_MAX || y==Y_MAX || x<X_MIN || y<Y_MIN){
			g.setColor( Color.white);
			g.fillRect(0,0,500,500);
			g.setFont(new Font("Serif",Font.ITALIC,50));
			g.setColor(Color.ORANGE);
			g.drawString("PERDU !",160,250);
			System.out.println("PERDU");
			nb=0;
		}
	}
	public static void main(String[] args) {
		Jeu animation = new Jeu("Pacman", 500, 500,200,150);
		animation.animer(1);
	}
}

Commentons un peu ce code.
Tout d’abord, notre objectif principal est d’ajouter la possibilit√© de faire bouger le pacman avec les touches du clavier. Je vais donc faire appel √† une interface tr√®s particuli√®re qui √©coute le clavier, c’est √† dire qui va regarder sur quelles touches vous appuyez. Ainsi, par la suite, nous pourrons lancer des actions selon la touche appuy√©e. On impl√©mente cette interface :

public class Jeu extends JFrame implements KeyListener{

Et on ajoute ces méthodes liées à cette interface :

	@Override
	public void keyPressed(KeyEvent e) {
		// TODO Auto-generated method stub
	}

	@Override
	public void keyReleased(KeyEvent arg0) {
		// TODO Auto-generated method stub

	}

	@Override
	public void keyTyped(KeyEvent arg0) {
		// TODO Auto-generated method stub

	}

J’ai ajout√© des variables globales :

	private int compteur ;

	/* PACMAN COLORS */
	Color couleur1, couleur2;

	/* COORDINATES */
	public int x=10;
	public int y=30;

	/* DEFAULT COORDINATES */
	public final int X_INIT=10;
	public final int Y_INIT=30;

	/* DIRECTION */
	/*H : 1 B : 2 D : 3 G : 4*/
	public int direction = 0, nb;

	public boolean test=false;

	/* LIMITS */
	public final int X_MIN = 10;
	public final int X_MAX = 440;
	public final int Y_MIN = 30;
	public final int Y_MAX = 440;

Nous pouvons d√©j√† deviner le r√īle de certaines de ces variables. Le x et y sont bien entendu les coordonn√©es de pacman. couleur1 et couleur2 sont les couleurs du pacman, couleur2 est une couleur qui ne changera jamais, et qui est jaune.

Si vous avez lu l’article pr√©c√©dent sur pacman, vous avez pu reconna√ģtre certaines parties du code tr√®s semblables. Entre autres le constructeur :

	public Jeu(String titre, int largeur,int hauteur,int posX,int posY) {
		super(titre);
		setSize( largeur, hauteur );
		setVisible( true );
		this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		this.setLocation(posX,posY);
		couleur2 = Color.yellow;
		addKeyListener(this);
	}

Comme je vous le disais auparavant couleur2 est la couleur jaune. Le petite diff√©rence avec le constructeur de l’article pr√©c√©dent est qu’on a rajout√© ceci : addKeyListener(this), c’est l’√©coute du clavier.

Vous reconna√ģtrez aussi la m√©thode animer(int nbr_mouvement) qui nous permettra d’animer Pacman :

	public void animer (int nbr_mouvement){
		nb=nbr_mouvement;
		for (compteur=0; compteur<nb; compteur++) {
			this.repaint();
			try {
				Thread.sleep(100);//pause between each pics.
			}
			catch (InterruptedException e) {
				e.printStackTrace();
			}
			nb++; // INFINI

		}
	}

La m√©thode animer() appelle la m√©thode repaint() qui redessine par desssus tout Pacman. A l’aide d’une boucle for, tant que le compteur est inf√©rieur √† nb , j’appelle donc repaint(). Seulement voil√†, j’incr√©mente nb. Ainsi ma boucle est infinie et ne s’arr√™te jamais !! Enfin presque…Nous verrons √ßa plus loin.
Si vous √™tes un lecteur aguerri et que vous avez pris le soin de lire l’article pr√©c√©dent, vous avez d√Ľ remarquer que ma fa√ßon de dessiner √† l’infini la m√©thode repaint() est tr√®s diff√©rente. En effet, j’avais mis une condition if au lieu d’incr√©menter :

		//on relance la méthode pour obtenir une boucle infinie !
		if(compteur==nbr_mouvement){
			compteur=0;
			x1=0;
			animer(48);
		}

Pas de panique, les deux m√©thodes sont bonnes, mais si j’ai choisi de cr√©er une variable globale appel√©e nb qui reprend dans un premier temps la valeur pass√©e en param√®tre puis ensuite s’incr√©mente √† l’infinie, c’est qu’il y a une bonne raison, et vous allez comprendre √ßa en lisant la suite de l’articleūüėÄ

Gérons maintenant les touches et le dessin du pacman selon la touche choisie.

Nous avions tout √† l’heure parl√© de l’impl√©mentation de de l’√©coute du clavier (keylistener) : implements KeyListener, maintenant occupons nous des m√©thodes li√©es √† cette √©coute :

/* METHODS KEYLISTENER */
    @Override
    public void keyPressed(KeyEvent e) {
        // TODO Auto-generated method stub
        switch (e.getKeyCode()){
            /* HAUT */
            case KeyEvent.VK_UP :
                //y=y-10;
                direction=1;
                System.out.println("HAUT");
                break;
            /* BAS */
            case KeyEvent.VK_DOWN :
                //ver = 3;
                //y=y+10;
                direction=2;
                System.out.println("BAS");
                break;
            /* DROIT */
            case KeyEvent.VK_RIGHT :
                //ver = 1;
                //x=x+10;
                direction=3;
                System.out.println("DROIT");
                break;
            /* GAUCHE */
            case KeyEvent.VK_LEFT :
                //ver = 4;
                //x=x-10;
                direction=4;
                System.out.println("GAUCHE");
                break;
            default :
                System.out.println(e.getKeyCode());
 
        }
 
    }
 
    @Override
    public void keyReleased(KeyEvent arg0) {
        // TODO Auto-generated method stub
 
    }
 
    @Override
    public void keyTyped(KeyEvent arg0) {
        // TODO Auto-generated method stub
 
    }

Lorsqu’on appuie sur une touche il y a trois √©v√®nements d√©tectable : la touche est press√©e, relach√©e et tap√©e.
La m√©thode keyPressed(KeyEvent e) g√®re les actions li√©e √† la touche press√©e, keyReleased(KeyEvent arg0) la touche relach√©e, et ,enfin, keyTyped(KeyEvent arg0) la touche tap√©e. L’utilit√© de distinguer ces trois √©v√®nements ? Imaginons que vous souhaitez d√©tecter que votre utilisateur a bien touch√© la touche Shift/Majuscule avant d’appuyer sur la touche J…Ben c’est l√† qu’on va se servir de ces m√©thodes (en jouant avec un boolean par exemple).
Bon nous ce qui nous int√©resse c’est keyPressed. On va retourner une valeur (direction) qui permettra ensuite de d√©finir la forme du pacman.

En effet, dans la fonction paint on dessine le pacman selon la valeur direction, c’est-√†-dire, si on va vers le bas, on dessine pas de la m√™me fa√ßon notre pacman (la bouche vers le bas par exemple).

Dernier point, et ensuite je vous laisse vous amuser avec le code pour découvrir par vous même le dessin avec Swing.
Si le pacman touche les bords, nb prend la valeur 0 afin de sortir de notre boucle for (compteur=0; compteur<nb; compteur++) (de la méthode animer). En sortant de la boucle on arrête de redessiner.:)

        if(x==X_MAX || y==Y_MAX || x<X_MIN || y<Y_MIN){
            g.setColor( Color.white);
            g.fillRect(0,0,500,500);
            g.setFont(new Font("Serif",Font.ITALIC,50));
            g.setColor(Color.ORANGE);
            g.drawString("PERDU !",160,250);
            System.out.println("PERDU");
            nb=0;
        }

Voilà, voilà, à vos claviers !

BONUS

T√©l√©charger le jeu (format .jar)ūüėÄ

Le community manager

Les Inconnus

C’est en fl√Ęnant sur facebook (oui je sais pl√©onasme…) que je suis tomb√© sur la page officielle des Iconnus, le trio Bourdon, Campan et L√©gitimus. Oui ces trois l√† qui ont fait rire les fran√ßais et qui continuent de les faire rire. Ils venaient d’ouvrir ce compte facebook afin de promouvoir leur film.¬†¬† En effet, ils font leur comeback le 12 F√©vrier 2014 dans vos salles de cin√©ma !

[Début de publicité]

Les Trois Frères, le retour : la bande annonce

[Fin de publicité]

Puis, j’ai d√©couvert que ce ne sont pas vraiment nos trois comp√®res qui g√®rent la page m√™me s’ils gardent un Ňďil dessus. Enfin je m’en doutais, mais j’ai d√©couvert que c’√©tait une personne en particulier qui g√©rait la page…

gif-who-bcq1

C’est le ou plut√īt la dans notre situation community manager ! (C’est Andr√©a Fort√© qui s’occupe de la page des Inconnus).

tumblr_mp5t47Ixjd1rknrf9o1_500

Eh oui, c’est elle qui est charg√©e d’apporter une nouvelle jeunesse au trio sur le web ! Afin de redorer le blason de nos vieux comiques qu’on avait perdu de vue., nous avons √† la carte : des sketchs les plus connus en streaming gratuitement sur myskreen, des photos ‘exclusives’ du tournage, des vid√©os…Bref tout un foin.

Ouais, mais c’est n√©cessaire ?

130314062614378068

Je veux dire : Nous avons des gens qui viennent des √©coles de commerce qui font du marketing, de la pub, blabla…Alors que fait le Community Manager ¬†?

FmPYE

Pour r√©pondre √† cette question…

130325051956834475

C’est pourquoi je vous invite √† lire cette article : Community manager ? R√©dacteur web ? C’est quoi ? √áa se mange ? Nan en fait ne lisez pas cet article…Lisez tout le blog ! :D¬†Tr√®s concis ce blog vous apportera de nombreuses r√©ponses:)

Pouh ! Je suis torchon chiffon carpette moi, je vais vous laisser. Sur ce je vous souhaite une excellent année 2014 à tous !:)

giphy