Deplacement d'un bord d'un element de l'Ui

Questions à propos du GUI, y compris la partie script.
tambwe
Messages : 7
Inscription : 30 Juin 2019 03:31

Deplacement d'un bord d'un element de l'Ui

Message par tambwe » 08 Juil 2019 16:08

Bonjour,
je souhaiterai savoir comment faire pour déplacer le bord inférieur d'un panel utilisé comme mask de façon à ce que ce bord inférieur suive la position d'un autre objet Ui ,une image cible par exemple ,si la cible monte le bord monte et seulement le bord, pas tous le panel , si la cible descend , le bord descend .Merci d'avance . :?: :?:

Image
Pièces jointes
bord.png
bord.png (10.46 Kio) Consulté 5192 fois
Si tu faiblis au jour de la détresse alors ta force n'est que détresse

Avatar de l’utilisateur
BassToss
Messages : 65
Inscription : 17 Mai 2019 06:01
Localisation : Cahors
Contact :

Re: Deplacement d'un bord d'un element de l'Ui

Message par BassToss » 14 Août 2019 18:43

Salut,
C'est un truc comme ça que tu veux faire?
Image
On s'fait un petit Canvas pour l'apéro?

Pour tester:http://www.starsheepstudio.com
Notre page:https://www.facebook.com/starsheepstudio

Avatar de l’utilisateur
Max
Messages : 8764
Inscription : 30 Juil 2011 13:57
Contact :

Re: Deplacement d'un bord d'un element de l'Ui

Message par Max » 14 Août 2019 18:50

[HS]vu l'heure, c'est pour mettre en pratique ce qu'il y a d'écris dans ta signature[/HS] :malin1:
Image
Pas d'aide par MP, le forum est là pour ça.
En cas de doute sur les bonnes pratiques à adopter sur le forum, consulter la Charte et sa FAQ

Avatar de l’utilisateur
BassToss
Messages : 65
Inscription : 17 Mai 2019 06:01
Localisation : Cahors
Contact :

Re: Deplacement d'un bord d'un element de l'Ui

Message par BassToss » 14 Août 2019 18:58

Max a écrit :
14 Août 2019 18:50
[HS]vu l'heure, c'est pour mettre en pratique ce qu'il y a d'écris dans ta signature[/HS] :malin1:
C'est tellement ça ^^
On s'fait un petit Canvas pour l'apéro?

Pour tester:http://www.starsheepstudio.com
Notre page:https://www.facebook.com/starsheepstudio

tambwe
Messages : 7
Inscription : 30 Juin 2019 03:31

Re: Deplacement d'un bord d'un element de l'Ui

Message par tambwe » 26 Août 2019 00:26

Salut tout le monde,
Exactement Bass Toss , c'est ce que je voudrais faire, comment puis-je faire , le script qui pourra aller avec ?
Si tu faiblis au jour de la détresse alors ta force n'est que détresse

Avatar de l’utilisateur
BassToss
Messages : 65
Inscription : 17 Mai 2019 06:01
Localisation : Cahors
Contact :

Re: Deplacement d'un bord d'un element de l'Ui

Message par BassToss » 26 Août 2019 13:02

Tien tien... C'est la fin des vacances ? ::d

en fait il y deux questions en une dans ta demande:

pour la question n°1:
la méthode la plus simple consiste à créer un "Sprite mask" avec la forme que tu veux (en l'occurence dans mon exemple un long rectangle) et un "SpriteRenderer" configuré en mode "inside mask" qui contient la texture ou le dessin que tu veux faire apparaître dans ton "SpriteMask".
Important : je ne sais pas si tu as déjà utilisé des sprite mask, dans le doute note bien que la forme de ton mask est donnée par le sprite que tu lui met en référence, donc si tu veux un mask rectangulaire il te faut un sprite de forme rectangulaire.

C'est un peu chiant à expliquer par écrit, je sais pas si je suis bien clair, alors je te fais quelques screenshots:

étape 1: tu créer un spriteRenderer avec la texture ou dessin que tu veux faire apparaître dans le mask:
Image

étape 2: tu n'oublie pas de le paramétrer en mode "Visible INSIDE mask"
Image

étape 3: tu créer un SpriteMask en lui référencant un sprite qui a la forme que tu souhaite (la mon dessin qui défini la forme s'appel "bibli1")
Image

La petite astuce pour obtenir ton effet c'est de positionner le mask tout en haut du canvas, comme ça quand le mask descendra il fera apparaître la texture du Sprite Renderer :
Image

Note que dans un canvas, normalement on utilise de préférence des components de type "image" plutôt que des "sprites Renderer" mais ça marche aussi avec eux moyennant quelques bidouilles. Pour ta demande j'ai été au plus simple, il y a surement pleins d'autres manières de faire ce que tu souhaite!!

Ensuite on arrive à ta deuxième question:
comment déplacer le mask?
là il faudrait plus d'infos sur la manière dont tu veux le déplacer...
si tu veux juste le déplacer de haut en bas (et inversement) avec deux touches, un simple code du genre peut faire le taf (à placer sur l'objet qui contient le mask):

Code : Tout sélectionner

public class MoveThisShit : MonoBehaviour
{
    // Start is called before the first frame update
	public float speed = 1.5f;


		

		void Update ()
		{
			if (Input.GetKey(KeyCode.UpArrow))
			{
				transform.position += Vector3.up * speed * Time.deltaTime;
			}
			if (Input.GetKey(KeyCode.DownArrow))
			{
				transform.position += Vector3.down * speed * Time.deltaTime;
			}
		}
	}
On s'fait un petit Canvas pour l'apéro?

Pour tester:http://www.starsheepstudio.com
Notre page:https://www.facebook.com/starsheepstudio

Avatar de l’utilisateur
BassToss
Messages : 65
Inscription : 17 Mai 2019 06:01
Localisation : Cahors
Contact :

Re: Deplacement d'un bord d'un element de l'Ui

Message par BassToss » 02 Sep 2019 11:30

Je me suis rendu compte d'un détail sur mes screens; j'ai fait un truc inutile et qui peut être chiant:
tu n'as pas besoin de mettre les sprites directement dans le canvas,
tu peux mettre tes sprites et ton mask dans la hierarchy, Le canvas est seulement indispensable pour du texte ou autre élément Gui mais pas pour l'effet que tu souhaite.

Autre détail important: Personnellement les canvas je les règle en mode "Sreen space camera", je référence une camera en mode "orthographic" que je créé directement dans le canvas.

C'est beaucoup plus simple de gérer un canvas avec cette méthode que d'utiliser le réglage par défaut d'unity qui est tjrs en "screen space overlay". (je n'ai tjrs pas compris l'intéret de ce réglage "overlay" à part qu'il est juste ultra casse c....... à gérer).
L'avantage du "screen space camera" c'est que tu peux gérer des trucs sur ta scène tout en ayant un canvas qui se place dessus et du coup pas de surprises avec les textes qui disparaissent en mode play ect... Tu vois dans ta scène ce que tu verras en jeu! Et pour charger des canvas "prefab" en runtime c'est aussi vraiment pratique.

Image
On s'fait un petit Canvas pour l'apéro?

Pour tester:http://www.starsheepstudio.com
Notre page:https://www.facebook.com/starsheepstudio

Répondre

Revenir vers « L'interface GUI »