utf8_encode vs iconv

utf8_encode vs iconv

Attention, utf8_encode n’encode que depuis ISO-8859-1 pour tout autres encodage il faut utiliser iconv.

utf8_encode($text)

est la même chose que

 iconv('ISO-8859-1', 'UTF-8', $text)
Apache POI et le format comptabilité

Apache POI et le format comptabilité

Si vous devez formater une cellule au format compatibilité, voici comment faire.

Dans Excel sélectionner une cellule et formater la comme souhaité. Sélectionner alors « Autres format numériques » puis « Personnalisée ». Vous aurez alors la valeur copier dans votre code.

Vous devriez avoir un code comme ca:

DataFormat df = wb.createDataFormat();
dollarStyle = wb.createCellStyle();
dollarStyle.setDataFormat(df.getFormat("_-[$$-409]* # ##0,00_ ;_-[$$-409]* -# ##0,00\\ ;_-[$$-409]* \"-\"??_ ;_-@_ "));
Android Emulator et la caméra

Android Emulator et la caméra

Afin d’utiliser la caméra de votre ordinateur avec l’Android Emulator, il vous faut suivre les étapes suivantes:

Cliquez sur l’icône de l’ADV Manager, la 2eme.
Puis sur l’icône Edit this ADV, la 2eme
Cliquez sur Show Advanced Settings

Vous pouvez maintenant choisir diverse valeurs pour les caméras avant et arrière de l’émulateur.

React Native init

React Native init

Petit guide de démarrage ultra rapide React Native et React Navigation. Un premier passage sur https://facebook.github.io/react-native/docs/getting-started afin d’installer les outils necessaire (xcode, nodejs, python, java, android studio). Puis ensuite voici les commandes pour un nouveau projet :

npm install -g react-native-cli
react-native init MyProject
cd MyProject
npm install --save react-navigation
npm install --save react-native-gesture-handler
react-native link

Si vous êtes sous Mac avec xcode vous pouvez lancer l’émulateur iOS avec:

react-native run-ios

Pour Android il faut utiliser :

react-native run-android

Afin de s’y retrouver dans le code j’utilise l’arborescence suivante:

src
- components
- screens

La suite bientôt.

Un plugin Gutenberg pour ajouter une carte Google statique

Un plugin Gutenberg pour ajouter une carte Google statique

Gutenberg est le nouvel éditeur de WordPress, il est dans le même type que celui de Medium. Tout est bloc, texte, image, galerie, titre, liste. J’ai voulu voir comment rajouter un nouveau bloc. Il est basé sur React, c’est donc du JavaScript.

La première partie du plugin est un fichier PHP afin de charger notre fichier JavaScript:

La partie JavaScript fessant dans les 100 lignes, je vais la décomposer pour bien l’expliquer.

Dans la première partie nous déclarons des variables afin d’alléger la suite du code. La première ligne fait référence a une fonction de React. Comme vous pouvez le voir, nous utilisons wp.element et wp.blocks que nous avions déclaré en dépendance dans le script PHP.

L’étape suivante est de déclarer notre nouveau bloc. Nous utilisons la fonction registerBlockType que nous avons déclaré au dessus.

Le premier argument est le nom de notre bloc, il faut qu’il soit sous la forme « vendeur/nom-du-bloc ».

Le deuxième argument est un objet. Dans un premier temps nous lui donnons un titre, une icône (peut être une icône Dashicons), une catégorie (common, formatting, layout, widgets, embed) et des attributs (ce sont des informations persisté en base qui servent à l’affichage).

Ce qui donnera:

Toujours dans le deuxième paramètre nous définissons une fonctions save , sa valeur de retour est le code HTML qui sera visible coté utilisateur.

Dans notre cas nous récupérons les trois valeurs que nous avons déclaré dans les attributs, puis nous créons une image avec ces valeurs. Une classe CSS est automatiquement créé pour notre bloque, nous l’ajoutons avec className: props.className .

Le gros morceau arrive, la partie de l’éditeur. Elle consiste en une fonction edit , sa valeur de retour est un tableau qui contient ce qui seras affiché, mais aussi d’autre informations tels que la barre d’outils et des informations l’inspecteur (la partie à droite de Gutenberg).

Dans un premier temps nous récupérons les valeurs des attributs ou nous les initialisons et nous récupérons le focus. Ensuite viennent trois fonctions pour mettre à jour nos attribut, il faut bien utiliser la fonction  props.setAttributes()  pour que les changements soit visible a l’écran.

Viens ensuite la valeur de retour.

Le premier élément est ce qui doit être affiché dans l’éditeur, vous remarquerez que c’est la même chose que le retour de la fonction save , nous voulons afficher la carte.

Le deuxième élément commence par !!focus  afin de n’afficher la suite que si nous avons sélectionné notre bloc. Nous définissons ici la partie inspection avec un titre et trois éléments de contrôle, rien de bien compliqué ici.

Voici a quoi ressemble l’interface d’édition:

Une documentation est accessible sur ce site ainsi que sur le Github du projet.