[JAVA] Introduction à la programmation pour les étudiants du Collège: création de canevas

Référence: Qiita ne s'imprime pas bien. Si vous souhaitez imprimer ou convertir au format PDF, veuillez consulter http://gurakura.sakura.ne.jp/hellomondrian/makecanvas/ (http://gurakura.sakura.ne.jp/hellomondrian/makura.ne.jp/hellomondrian/) Même contenu).

introduction

Même si vous dessinez une image avec un programme, il ne démarrera que s'il y a un endroit pour dessiner. Commençons par créer une toile.

Spécifier la taille

En traitement, si vous appuyez simplement sur le bouton d'exécution sans écrire de programme, une petite fenêtre s'affiche. Cette fenêtre est le canevas, où les animations sont dessinées par programme.

La taille du canevas (fenêtre) est définie par une fonction appelée size. Qu'est-ce que c'est même si on l'appelle soudainement une «fonction»? Vous avez peut-être une question, mais je vais l'expliquer un par un, mais entrez d'abord le programme suivant (également appelé code) et exécutez-le:

size(400,300);

Je pense que vous avez vu une fenêtre plus grande que lorsque vous l'avez exécutée sans rien écrire.

Immédiatement après la taille, "(400,300)" est écrit. Il s'agit de l'argument (également appelé paramètre) de la fonction de taille. La fonction de taille est utilisée comme taille (largeur, hauteur). La largeur et la hauteur sont spécifiées en pixels.

Un pixel est un pixel. En anglais, il est écrit comme élément d'image. S'il est raccourci, il devient pic-el, et lorsqu'il est écrit comme un mot, il est décrit comme pixel.

Si vous n'êtes pas familier avec les pixels, vous pouvez utiliser l'outil de loupe de Photoshop pour zoomer sur l'image et cela ressemblera à une mosaïque de carrés. Chacun des carrés est un pixel.

Pause de conversation tranquille. Pour résumer l'explication jusqu'à présent, la taille des morceaux de programme (400 300) indique à l'ordinateur (ou au traitement) que la zone à dessiner doit avoir une largeur de 400 pixels et une hauteur de 300 pixels. Ça ne sera pas. Bien sûr, la taille (700 700) etc. vous donnera une toile carrée.

Si vous voyez une erreur, vérifiez l'entrée point-virgule (;). Vous devez ajouter la taille (400 300) et un point-virgule à la fin, pas la taille (400 300).

Pour dire très grossièrement pourquoi nous avons besoin de quelque chose comme ça, size (400,300) est une "instruction" qui appelle la fonction size avec les arguments 400 et 300. Un point-virgule est ajouté à la fin de l'instruction pour indiquer au traitement de la rupture de l'instruction.

Le langage utilisé dans le traitement est Java, donc si vous voulez en savoir plus sur ce domaine, veuillez consulter les livres de référence Java.


Colonne 1: Pourquoi la taille?

Pourquoi dois-je appeler une fonction appelée taille pour spécifier la taille de la cible de dessin? Pourquoi ne puis-je pas utiliser makeCanvas ou setCanvasSize? Certaines personnes peuvent avoir une telle question.

Autrement dit, le logiciel appelé Traitement est conçu par des personnes. Parce qu'il n'a pas été fait par Dieu. Le fait est que le créateur (= le créateur de Processing) a décidé de cette façon, ni plus, ni moins.

Pourquoi est-ce une fonction appelée taille qui spécifie la taille de la cible de dessin? La question est, pourquoi la magie de la récupération de la santé dans Dragon Quest s'appelle Hoimi? C'est le même que le problème, c'est-à-dire parce que les créateurs ont décidé de cette façon.

De cette façon, dans l'apprentissage de la programmation, il est important de faire la distinction entre ce qui est dérivé logiquement et ce qui n'est pas logique, comme le nom de la fonction de taille, car c'est une telle chose. Il n'y a pas de réponse logique même si vous vous demandez "Pourquoi cela arrive-t-il?" Pour la partie illogique.


Colonne 2: Fonctions du langage de programmation?

En mathématiques du secondaire, vous avez peut-être vu la description telle que y = f (x). f était le nom de la fonction, et f (x) signifiait que nous utilisions x comme argument de la fonction f (vous vous souvenez?). La fonction appelée size est une fonction qui nécessite deux arguments. La taille de la description (400,300) signifie que la fonction de taille est exécutée (également appelée, etc.) avec le premier argument étant 400 et le second argument étant 300.

Les fonctions du langage Java utilisées par Processing et les fonctions mathématiques ne sont pas nécessairement le même concept. Cependant, je pense que c'est similaire en ce que vous donnez une certaine valeur comme argument et l'évaluez. Est-ce quelque chose comme «quelque chose» pour appeler une fonction?


Spécifiez la couleur d'arrière-plan (couleur d'arrière-plan)

En appelant la fonction de taille, il y a une limite pour chaque ordinateur, et cela signifie "dans cette limite" (la liberté illimitée est difficile à trouver ...) - la taille est Vous pouvez maintenant le définir.

Cependant, même lorsque vous sélectionnez la toile réelle (la toile comme cible de dessin physique), je pense que vous êtes préoccupé par le matériau ainsi que par la taille. En particulier, la couleur de la toile est également un facteur important lorsque la toile entière n'est pas remplie et que la couleur d'arrière-plan est également utilisée.

Dans cette section, nous expliquerons comment définir la couleur d'arrière-plan du canevas.

Avec la fonction de taille, j'ai pu spécifier (définir) la taille, mais pas la couleur d'arrière-plan (couleur d'arrière-plan de la fenêtre). Utilisez la fonction d'arrière-plan pour spécifier la couleur d'arrière-plan. Il existe différentes manières d'utiliser la fonction d'arrière-plan, mais ici nous expliquerons comment la spécifier à l'aide d'une valeur RVB. Comment utiliser la fonction d'arrière-plan

background(Valeur de R,Valeur de G,Valeur de B)

Ce sera. Chaque valeur de R, V, B spécifie une valeur comprise entre 0 et 255. C'est une bonne idée de vérifier à l'avance quel type de valeur RVB sera quel type de couleur, comme dans Photoshop. Par exemple, la couleur du violet ancien (Kodaimurasaki) aurait R de 137, G de 91 et B de 138.

Ce n'est pas limité aux ordinateurs, mais lorsqu'il s'agit de plusieurs valeurs Des notations telles que (R, G, B) = (137,91,138) sont souvent utilisées. Cette méthode de notation sera également utilisée dans cette série.

100% de blanc sur un ordinateur a une valeur de 255 pour chaque RVB. Ce n'est rien d'autre que (R, G, B) = (255,255,255).

Par exemple, pour créer un canevas de taille 400 x 300 (note: la zone de dessin de taille (400,300) peut être représentée de cette façon) avec une couleur de fond 100 % blanche, le programme serait: :

background(255,255,255);
size(400,300);

Lorsque vous exécutez ce programme, vous verrez une fenêtre de taille 400x300 avec un intérieur blanc.

Jusqu'à présent, nous avons deux fonctions. Quand chaque fonction sera-t-elle traitée (exécutée)? Le programme est essentiellement exécuté dans l'ordre de la ligne supérieure à la ligne inférieure. Autrement dit, pour la liste ci-dessus, la fonction de taille est exécutée après la fonction d'arrière-plan.

Dans un programme, l'ordre de traitement (dans ce cas, l'ordre d'exécution de la fonction) est très important. Par conséquent, le programme suivant et le programme répertorié immédiatement ci-dessus sont des programmes complètement différents.

size(400,300);
background(255,255,255);

Au cas où, essayez les deux. Je pense qu'ils ont tous deux donné le même résultat.

Peut-être que certains d'entre vous pourraient penser: "Les programmes ont des significations différentes, mais il n'y a pas de différence. C'est étrange. C'est étrange. Je ne comprends pas." En fait, dans le monde des programmes, il existe différents programmes qui ont le même résultat d'exécution.

Dans ce cas, peu importe le processus de spécification de la taille du canevas et le processus de spécification de la couleur d'arrière-plan qui est exécuté en premier. Dans ce cas, il n'y a pas de réponse correcte, veuillez donc l'écrire comme vous le souhaitez.

Voilà, je vais donc terminer cette section avec l'exemple de programme que j'ai montré plus tôt qui met en place une toile carrée avec un ancien fond de couleur haricot.

background(137,91,138);
size(400,300);

Recommended Posts

Introduction à la programmation pour les étudiants du Collège: création de canevas
Introduction à la programmation pour les étudiants du Collège: Introduction
Introduction à la programmation pour les étudiants du collégial: variables
Introduction à la programmation pour les étudiants du Collège: dessiner des lignes droites
Introduction à la programmation pour les étudiants du collégial (mise à jour de temps à autre)
Introduction à la programmation pour les étudiants du Collège: Préparation Installons le traitement
Introduction à la programmation pour les étudiants: comment dessiner des carrés de base
Introduction à la programmation pour les étudiants du collège: rendre les lignes droites plus attrayantes
Introduction à la programmation pour les étudiants du collégial: diverses fonctions liées aux carrés (partie 2)
Introduction à la programmation pratique
Une introduction aux types fonctionnels pour les programmeurs orientés objet dans Elm
Introduction à la programmation fonctionnelle (Java, Javascript)
[Introduction à JSP + Servlet] J'ai joué avec pendant un moment ♬
La programmation de jeux Ruby a commencé avec un navigateur: Introduction à Nyle-canvas (style DXRuby)
Introduction à Java pour la première fois # 2
C'est bien d'aller dans une école de programmation.
[Introduction à Java] Comment écrire un programme Java
Comment créer un référentiel Maven pour 2020
[Introduction à JSP + Servlet] Une petite animation ♬
Introduction à kotlin pour les développeurs iOS ④-type
[Introduction à Docker] Créer une image Docker pour l'apprentissage automatique et utiliser le notebook Jupyter
Apprenez à créer un serveur WEB Introduction au développement d'applications WEB à partir des bases
Comment créer une base de données H2 n'importe où
Plug-in VS Code recommandé pour les élèves des écoles de programmation
Introduction aux fonctions récursives: qu'est-ce qu'une fonction récursive?
[Java] Créons un Minecraft Mod 1.14.4 [Introduction]
Introduction à kotlin pour les développeurs iOS ⑤-XML pratique
Comment créer un JRE léger pour la distribution
[Java] Créons un Minecraft Mod 1.16.1 [Introduction]
Introduction à kotlin pour les développeurs iOS ③-À propos de gradle
Introduction à kotlin pour les développeurs iOS ①-Construction de l'environnement
Premiers pas avec Groovy pour les ingénieurs Java gênants
Introduction à kotlin pour les développeurs iOS ②-Création de projet
[Introduction à Java] Bases de l'arithmétique Java (pour les débutants)
Prise de conscience de l'orientation objet pendant six mois de programmation