Derniers messages sur Zeste de Savoirhttps://zestedesavoir.com/forums/2021-03-22T18:51:58+01:00Les derniers messages parus sur le forum de Zeste de Savoir.Mettre un style a un autre element quand on focus un input , message #2325222021-03-22T18:51:58+01:00viki53/@viki53https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232522<p>Il y a gens qui n’ont pas de JS dans leur navigateur pour d’autres raisons que la paranoïa : certains n’ont pas un appareil assez puissant, un navigateur qui ne le gère pas ou mal (par exemple certains navigateurs pour malvoyants), d’autres utilisent un VPN ou un proxy qui le bloque… tout un tas de raisons qui font que le JS n’est pas une solution. Que certains soient paranos n’empêche pas de leur proposer une expérience correcte.</p>
<p>Et les sites faits en JS… ne devraient probablement pas être faits en JS. Des applications oui, des sites non. Les frameworks JS sont bien trop abusés.</p>
<p>jQuery est de moins en moins utilisé, et ne garantit pas pour autant une compatibilité pour tout. D’autant plus que l’importer pour ajouter une simple gestion du focus c’est inutilement lourd (et de la dette technique en plus).</p>
<p>Les styles passent plus facilement les filtres des proxys/pare-feu que le JS et le non-chargement du CSS va casser toute la mise en page, pas juste une fonctionnalité, l’utilisateur se rendra plus facilement compte qu’il y a un problème que si un JS manque.</p>
<p>P.S. : Tu as aussi le droit de répondre plus aimablement. Que mes arguments ne soient pas toujours applicables suivant les projets pourquoi pas, dire qu’ils sont faux, non.</p>Mettre un style a un autre element quand on focus un input , message #2325212021-03-22T17:56:20+01:00anonyme/@anonymehttps://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232521<figure><blockquote>
<p>À noter que tout le monde n’active pas le <abbr title="JavaScript">JS</abbr>, ou que le support n’est pas partout le même… ou que le fichier peut n’être tout simplement pas chargé. Une solution CSS propre est souvent préférable à du <abbr title="JavaScript">JS</abbr>.</p>
<p></p>
</blockquote><figcaption><a href="https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232509">viki53</a></figcaption></figure>
<ul>
<li>Tout le monde n’active pas le <abbr title="JavaScript">JS</abbr> : Pratique pour les sites réalisés avec des frameworks <abbr title="JavaScript">JS</abbr> … J’ai envie de dire <strong>osef</strong> pour les gens paranos.</li>
<li>Le support n’est pas partout le même : Si tu utilises jQuery ou un framework y’a pas de raison que ce ne soit pas compatible.</li>
<li>Le fichier peut n’être tout simplement pas chargé : quelle différence avec un fichier CSS ? Tu ne vas pas le mettre dans une balise <code><style></code>.</li>
</ul>
<p>Ce sera toujours mieux en CSS, c’est réutilisable partout mais les 3 raisons que tu donnes sont totalement fausses.</p>Mettre un style a un autre element quand on focus un input , message #2325092021-03-22T10:00:08+01:00viki53/@viki53https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232509<figure><blockquote>
<p>Cimer, elle est bien ta solution, j’avais finalement reussir a faire mais j’ai du sortir du <abbr title="JavaScript">JS</abbr> pour le faire :/ </p>
</blockquote><figcaption><a href="https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232427">biczosamuelpro</a></figcaption></figure>
<p>À noter que tout le monde n’active pas le <abbr title="JavaScript">JS</abbr>, ou que le support n’est pas partout le même… ou que le fichier peut n’être tout simplement pas chargé. Une solution CSS propre est souvent préférable à du <abbr title="JavaScript">JS</abbr>.</p>Mettre un style a un autre element quand on focus un input , message #2324272021-03-18T23:04:45+01:00biczosamuelpro/@biczosamuelprohttps://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232427<figure><blockquote>
<p>Hello, ils ont probablement intégré le TextField de Material-UI.</p>
<p>Voici un exemple en pure CSS : <a href="https://codepen.io/Yarflam/pen/QWGXMgZ">https://codepen.io/Yarflam/pen/QWGXMgZ</a></p>
<div class="hljs-code-div hljs-code-less"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span></div><pre><code class="hljs language-less"><span class="hljs-selector-tag">div</span><span class="hljs-selector-class">.loginField</span>
<span class="hljs-selector-tag">input</span>(placeholder=(<span class="hljs-string">" "</span>))
<span class="hljs-selector-tag">label</span> <span class="hljs-selector-tag">Username</span> <span class="hljs-selector-tag">or</span> <span class="hljs-selector-tag">Email</span>
</code></pre></div>
<div class="hljs-code-div hljs-code-css"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span><span data-count="4"></span><span data-count="5"></span><span data-count="6"></span><span data-count="7"></span><span data-count="8"></span><span data-count="9"></span><span data-count="10"></span><span data-count="11"></span><span data-count="12"></span><span data-count="13"></span><span data-count="14"></span><span data-count="15"></span><span data-count="16"></span><span data-count="17"></span><span data-count="18"></span><span data-count="19"></span><span data-count="20"></span><span data-count="21"></span><span data-count="22"></span><span data-count="23"></span><span data-count="24"></span><span data-count="25"></span><span data-count="26"></span><span data-count="27"></span><span data-count="28"></span><span data-count="29"></span><span data-count="30"></span><span data-count="31"></span><span data-count="32"></span><span data-count="33"></span><span data-count="34"></span><span data-count="35"></span><span data-count="36"></span><span data-count="37"></span></div><pre><code class="hljs language-css"><span class="hljs-selector-class">.loginField</span> {
<span class="hljs-attribute">position</span>: relative; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">display</span>: inline-block; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">border-radius</span>: <span class="hljs-number">3px</span>;
<span class="hljs-attribute">font-family</span>: <span class="hljs-string">'Ubuntu'</span>, <span class="hljs-string">'Roboto'</span>, <span class="hljs-string">'Arial'</span>;
<span class="hljs-attribute">font-size</span>: <span class="hljs-number">1em</span>;
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span> {
<span class="hljs-attribute">position</span>: relative; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">background-color</span>: <span class="hljs-built_in">rgba</span>(<span class="hljs-number">0</span>,<span class="hljs-number">0</span>,<span class="hljs-number">0</span>,<span class="hljs-number">0</span>);
<span class="hljs-attribute">border</span>: <span class="hljs-number">3px</span> solid <span class="hljs-built_in">rgba</span>(<span class="hljs-number">0</span>, <span class="hljs-number">0</span>, <span class="hljs-number">0</span>, <span class="hljs-number">0.5</span>);
<span class="hljs-attribute">border-radius</span>: <span class="hljs-number">3px</span>;
<span class="hljs-attribute">padding</span>: <span class="hljs-number">15px</span> <span class="hljs-number">10px</span> <span class="hljs-number">10px</span> <span class="hljs-number">10px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">outline</span>: <span class="hljs-number">0</span>;
<span class="hljs-attribute">transition</span>: all <span class="hljs-number">0.3s</span> ease;
<span class="hljs-attribute">z-index</span>: <span class="hljs-number">2</span>; <span class="hljs-comment">/* required */</span>
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span><span class="hljs-selector-pseudo">:focus</span> {
<span class="hljs-attribute">border-color</span>: <span class="hljs-built_in">rgba</span>(<span class="hljs-number">0</span>, <span class="hljs-number">0</span>, <span class="hljs-number">100</span>, <span class="hljs-number">0.8</span>);
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">label</span> {
<span class="hljs-attribute">position</span>: absolute; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">top</span>: <span class="hljs-number">14px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">left</span>: <span class="hljs-number">12px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">transition</span>: all <span class="hljs-number">0.3s</span> ease;
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span><span class="hljs-selector-pseudo">:focus</span> + <span class="hljs-selector-tag">label</span>, <span class="hljs-comment">/* required */</span>
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span><span class="hljs-selector-pseudo">:not</span>(<span class="hljs-selector-pseudo">:placeholder-shown</span>) + <span class="hljs-selector-tag">label</span> { <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">top</span>: <span class="hljs-number">5px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">left</span>: <span class="hljs-number">5px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">font-size</span>: <span class="hljs-number">0.6em</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">color</span>: <span class="hljs-number">#333</span>;
}
</code></pre></div>
<p>J’ai indiqué par des <em>required</em> les attributs importants pour donner cet effet. Le reste c’est de l’esthétisme.</p>
</blockquote><figcaption><a href="https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232426">Yarflam</a></figcaption></figure>
<p>Cimer, elle est bien ta solution, j’avais finalement reussir a faire mais j’ai du sortir du JS pour le faire :/ </p>Mettre un style a un autre element quand on focus un input , message #2324262021-03-18T22:54:15+01:00anonyme/@anonymehttps://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232426<p>Hello, ils ont probablement intégré le TextField de Material-UI.</p>
<p>Voici un exemple en pure CSS : <a href="https://codepen.io/Yarflam/pen/QWGXMgZ">https://codepen.io/Yarflam/pen/QWGXMgZ</a></p>
<div class="hljs-code-div hljs-code-less"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span></div><pre><code class="hljs language-less"><span class="hljs-selector-tag">div</span><span class="hljs-selector-class">.loginField</span>
<span class="hljs-selector-tag">input</span>(placeholder=(<span class="hljs-string">" "</span>))
<span class="hljs-selector-tag">label</span> <span class="hljs-selector-tag">Username</span> <span class="hljs-selector-tag">or</span> <span class="hljs-selector-tag">Email</span>
</code></pre></div>
<div class="hljs-code-div hljs-code-css"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span><span data-count="4"></span><span data-count="5"></span><span data-count="6"></span><span data-count="7"></span><span data-count="8"></span><span data-count="9"></span><span data-count="10"></span><span data-count="11"></span><span data-count="12"></span><span data-count="13"></span><span data-count="14"></span><span data-count="15"></span><span data-count="16"></span><span data-count="17"></span><span data-count="18"></span><span data-count="19"></span><span data-count="20"></span><span data-count="21"></span><span data-count="22"></span><span data-count="23"></span><span data-count="24"></span><span data-count="25"></span><span data-count="26"></span><span data-count="27"></span><span data-count="28"></span><span data-count="29"></span><span data-count="30"></span><span data-count="31"></span><span data-count="32"></span><span data-count="33"></span><span data-count="34"></span><span data-count="35"></span><span data-count="36"></span><span data-count="37"></span></div><pre><code class="hljs language-css"><span class="hljs-selector-class">.loginField</span> {
<span class="hljs-attribute">position</span>: relative; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">display</span>: inline-block; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">border-radius</span>: <span class="hljs-number">3px</span>;
<span class="hljs-attribute">font-family</span>: <span class="hljs-string">'Ubuntu'</span>, <span class="hljs-string">'Roboto'</span>, <span class="hljs-string">'Arial'</span>;
<span class="hljs-attribute">font-size</span>: <span class="hljs-number">1em</span>;
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span> {
<span class="hljs-attribute">position</span>: relative; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">background-color</span>: <span class="hljs-built_in">rgba</span>(<span class="hljs-number">0</span>,<span class="hljs-number">0</span>,<span class="hljs-number">0</span>,<span class="hljs-number">0</span>);
<span class="hljs-attribute">border</span>: <span class="hljs-number">3px</span> solid <span class="hljs-built_in">rgba</span>(<span class="hljs-number">0</span>, <span class="hljs-number">0</span>, <span class="hljs-number">0</span>, <span class="hljs-number">0.5</span>);
<span class="hljs-attribute">border-radius</span>: <span class="hljs-number">3px</span>;
<span class="hljs-attribute">padding</span>: <span class="hljs-number">15px</span> <span class="hljs-number">10px</span> <span class="hljs-number">10px</span> <span class="hljs-number">10px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">outline</span>: <span class="hljs-number">0</span>;
<span class="hljs-attribute">transition</span>: all <span class="hljs-number">0.3s</span> ease;
<span class="hljs-attribute">z-index</span>: <span class="hljs-number">2</span>; <span class="hljs-comment">/* required */</span>
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span><span class="hljs-selector-pseudo">:focus</span> {
<span class="hljs-attribute">border-color</span>: <span class="hljs-built_in">rgba</span>(<span class="hljs-number">0</span>, <span class="hljs-number">0</span>, <span class="hljs-number">100</span>, <span class="hljs-number">0.8</span>);
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">label</span> {
<span class="hljs-attribute">position</span>: absolute; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">top</span>: <span class="hljs-number">14px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">left</span>: <span class="hljs-number">12px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">transition</span>: all <span class="hljs-number">0.3s</span> ease;
}
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span><span class="hljs-selector-pseudo">:focus</span> + <span class="hljs-selector-tag">label</span>, <span class="hljs-comment">/* required */</span>
<span class="hljs-selector-class">.loginField</span> > <span class="hljs-selector-tag">input</span><span class="hljs-selector-pseudo">:not</span>(<span class="hljs-selector-pseudo">:placeholder-shown</span>) + <span class="hljs-selector-tag">label</span> { <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">top</span>: <span class="hljs-number">5px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">left</span>: <span class="hljs-number">5px</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">font-size</span>: <span class="hljs-number">0.6em</span>; <span class="hljs-comment">/* required */</span>
<span class="hljs-attribute">color</span>: <span class="hljs-number">#333</span>;
}
</code></pre></div>
<p>J’ai indiqué par des <em>required</em> les attributs importants pour donner cet effet. Le reste c’est de l’esthétisme.</p>Mettre un style a un autre element quand on focus un input , message #2324172021-03-18T16:32:35+01:00viki53/@viki53https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232417<p>Si l’idée c’est la bordure, ils utilisent <code>box-shadow</code> (mais <code>border</code> aurait un rendu similaire) sur le <code>label</code> qui entoure l'<code>input</code>.</p>
<p>Si c’est pour déplacer le texte, ils jouent sur la position du texte dans le <code>label</code>.</p>
<p>Leur HTML n’est pas des plus propres, et il y a du JavaScript rajouté un peu partout (parfois sans grand intérêt), donc la structure est pas forcément à copier telle-quelle, mais l’idée fonctionne.</p>Mettre un style a un autre element quand on focus un input , message #2324162021-03-18T15:40:51+01:00biczosamuelpro/@biczosamuelprohttps://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232416<figure><blockquote>
<p>Bonjour,</p>
<p>CSS ne permet de cibler que des élément descendants dans un même sélecteur, pas de remonter le DOM (<code>input</code> étant ici un enfant/descendant de <code>body</code> et non l’inverse).</p>
<p>Je ne vois pas trop de quelle animation il s’agit de répliquer, autrement… <img src="/static/smileys/svg/1f914.svg" alt="🤔" class="smiley"></p>
</blockquote><figcaption><a href="https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232415">viki53</a></figcaption></figure>
<p>Ah oki, c’est pour sa que sa marche quand on veut faire un menu de navigation ou lorsqu’on survole une li on peut hidden ou faire réappartaitre pour une liste déroulante ! J’apprend un truc la ! </p>
<p>Avec cette info je vois comment je peut faire merci ! Sinon j’essaye de faire cette animation la : </p>
<p><a href="https://gifyu.com/image/fMmZ">https://gifyu.com/image/fMmZ</a></p>Mettre un style a un autre element quand on focus un input , message #2324152021-03-18T15:13:50+01:00viki53/@viki53https://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232415<p>Bonjour,</p>
<p>CSS ne permet de cibler que des élément descendants dans un même sélecteur, pas de remonter le DOM (<code>input</code> étant ici un enfant/descendant de <code>body</code> et non l’inverse).</p>
<p>Je ne vois pas trop de quelle animation il s’agit de répliquer, autrement… <img src="/static/smileys/svg/1f914.svg" alt="🤔" class="smiley"></p>Mettre un style a un autre element quand on focus un input , message #2324142021-03-18T14:41:46+01:00biczosamuelpro/@biczosamuelprohttps://zestedesavoir.com/forums/sujet/15161/mettre-un-style-a-un-autre-element-quand-on-focus-un-input/?page=1#p232414<p>Bonjour, </p>
<p>C’est la première fois que je poste ici, en esperant avoir de l’aide merci d’avance en tout cas ! </p>
<p>Mon problème est simple a prioris ! Voilà j’essaye de recoder le page d’accueil de twitter mais je n’arrive pas a faire l’animation que nous produit twitter lorsqu’on clique sur le <input> du formulaire avec le texte qui se deplace etc… si vous voulez voir je vous invite a regarder sa. </p>
<p>Alors j’ai pris une page html vierge et j’ai tester ceci : </p>
<div class="hljs-code-div hljs-code-html"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span><span data-count="4"></span><span data-count="5"></span><span data-count="6"></span><span data-count="7"></span><span data-count="8"></span><span data-count="9"></span></div><pre><code class="hljs language-html"><span class="hljs-meta"><!DOCTYPE <span class="hljs-meta-keyword">html</span>></span>
<span class="hljs-tag"><<span class="hljs-name">html</span> <span class="hljs-attr">lang</span>=<span class="hljs-string">"fr"</span>></span>
<span class="hljs-tag"><<span class="hljs-name">head</span>></span>
<span class="hljs-tag"><<span class="hljs-name">link</span> <span class="hljs-attr">rel</span>=<span class="hljs-string">"stylesheet"</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"styles.css"</span>></span>
<span class="hljs-tag"></<span class="hljs-name">head</span>></span>
<span class="hljs-tag"><<span class="hljs-name">body</span>></span>
<span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"text"</span>></span>
</body
<span class="hljs-tag"></<span class="hljs-name">html</span>></span>
</code></pre></div>
<p>Cette page, très simple mets juste une balise input et lorsque je focus dedans je veux que le background-color du body devient rouge par exemple j’ai donc fait ce code css la : </p>
<div class="hljs-code-div hljs-code-css"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span><span data-count="4"></span></div><pre><code class="hljs language-css"><span class="hljs-selector-tag">input</span><span class="hljs-selector-pseudo">:focus</span> <span class="hljs-selector-tag">body</span>
{
<span class="hljs-attribute">background-color</span>: red;
}
</code></pre></div>
<p>et ceci ne fonctionne pas aurez vous une idée du pourquoi du comment ? </p>Problème avec c++, message #2247452020-08-07T20:29:46+02:00jo_link_noir/@jo_link_noirhttps://zestedesavoir.com/forums/sujet/14421/probleme-avec-c/?page=1#p224745<p><code>using namespace std</code> est considéré comme une mauvaise pratique (encore plus dans un .h qui va impacter tous les fichiers qui l’inclut): <a href="https://openclassrooms.com/forum/sujet/identificateur-introuvable-c?page=1#message-91264221">https://openclassrooms.com/forum/sujet/identificateur-introuvable-c?page=1#message-91264221</a></p>Problème avec c++, message #2247402020-08-07T18:25:31+02:00Toinou88/@Toinou88https://zestedesavoir.com/forums/sujet/14421/probleme-avec-c/?page=1#p224740<p><a href="/membres/voir/valerian/" rel="nofollow" class="ping ping-link">@<span class="ping-username">valerian</span></a>.roura Merci bien je saurais comment faire la prochaine fois !
<a href="/membres/voir/Yarflam/" rel="nofollow" class="ping ping-link">@<span class="ping-username">Yarflam</span></a> Ok merci pour tout, ca marche nickel à présent !
Merci à vous 2 pour vos réponses et bonne soirée à vous !</p>Problème avec c++, message #2247392020-08-07T17:35:42+02:00anonyme/@anonymehttps://zestedesavoir.com/forums/sujet/14421/probleme-avec-c/?page=1#p224739<p>Bonjour,</p>
<p>Oui penses à commenter ton code :</p>
<div class="hljs-code-div hljs-code-c++"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span><span data-count="4"></span><span data-count="5"></span><span data-count="6"></span><span data-count="7"></span><span data-count="8"></span><span data-count="9"></span><span data-count="10"></span><span data-count="11"></span><span data-count="12"></span><span data-count="13"></span><span data-count="14"></span><span data-count="15"></span><span data-count="16"></span><span data-count="17"></span><span data-count="18"></span><span data-count="19"></span><span data-count="20"></span><span data-count="21"></span><span data-count="22"></span><span data-count="23"></span><span data-count="24"></span><span data-count="25"></span><span data-count="26"></span></div><pre><code class="hljs language-c++">Test.cpp
```c++
<span class="hljs-meta">#<span class="hljs-meta-keyword">include</span> <span class="hljs-meta-string"><iostream></span></span>
<span class="hljs-meta">#<span class="hljs-meta-keyword">include</span> <span class="hljs-meta-string">"Test.h"</span></span>
<span class="hljs-function"><span class="hljs-keyword">void</span> <span class="hljs-title">afficher_message</span><span class="hljs-params">(<span class="hljs-built_in">std</span>::<span class="hljs-built_in">string</span> <span class="hljs-keyword">const</span> & message)</span> </span>{
<span class="hljs-built_in">std</span>::<span class="hljs-built_in">cout</span> << <span class="hljs-string">"J’ai reçu un message : "</span> << <span class="hljs-built_in">std</span>::quoted(message) << <span class="hljs-built_in">std</span>::<span class="hljs-built_in">endl</span>;
}
<span class="hljs-function"><span class="hljs-keyword">int</span> <span class="hljs-title">main</span><span class="hljs-params">()</span> </span>{
<span class="hljs-comment">// Ici, on va utiliser la fonction.</span>
afficher_message(<span class="hljs-string">"Salut les lecteurs !"</span>);
<span class="hljs-keyword">return</span> <span class="hljs-number">0</span>;
}
```
Test.h
```c++
<span class="hljs-meta">#<span class="hljs-meta-keyword">ifndef</span> TEST_H</span>
<span class="hljs-meta">#<span class="hljs-meta-keyword">define</span> TEST_H</span>
<span class="hljs-meta">#<span class="hljs-meta-keyword">include</span> <span class="hljs-meta-string"><string></span></span>
<span class="hljs-function"><span class="hljs-keyword">void</span> <span class="hljs-title">afficher_message</span><span class="hljs-params">(<span class="hljs-built_in">std</span>::<span class="hljs-built_in">string</span> <span class="hljs-keyword">const</span> & message)</span></span>;
<span class="hljs-meta">#<span class="hljs-meta-keyword">endif</span></span>
```
</code></pre></div>
<p>Tu as oublié un import dans ton fichier <em>Test.cpp</em> pour utiliser <em>quoted()</em> :</p>
<div class="hljs-code-div hljs-code-c++"><div class="hljs-line-numbers"><span data-count="1"></span></div><pre><code class="hljs language-c++"><span class="hljs-meta">#<span class="hljs-meta-keyword">include</span> <span class="hljs-meta-string"><iomanip></span></span>
</code></pre></div>
<p>Ensuite pour les paramètres, tu peux simplifier :</p>
<div class="hljs-code-div hljs-code-c++"><div class="hljs-line-numbers"><span data-count="1"></span><span data-count="2"></span><span data-count="3"></span></div><pre><code class="hljs language-c++"><span class="hljs-function"><span class="hljs-keyword">void</span> <span class="hljs-title">afficher_message</span><span class="hljs-params">(<span class="hljs-built_in">std</span>::<span class="hljs-built_in">string</span> message)</span> </span>{
<span class="hljs-built_in">std</span>::<span class="hljs-built_in">cout</span> << <span class="hljs-string">"J’ai reçu un message : "</span> << <span class="hljs-built_in">std</span>::quoted(message) << <span class="hljs-built_in">std</span>::<span class="hljs-built_in">endl</span>;
}
</code></pre></div>
<p>Ne pas oublier de modifier la signature de fonction dans <em>Test.h</em> :</p>
<div class="hljs-code-div hljs-code-c++"><div class="hljs-line-numbers"><span data-count="1"></span></div><pre><code class="hljs language-c++"><span class="hljs-function"><span class="hljs-keyword">void</span> <span class="hljs-title">afficher_message</span><span class="hljs-params">(<span class="hljs-built_in">std</span>::<span class="hljs-built_in">string</span> message)</span></span>;
</code></pre></div>
<p>Edit : j’enlève <code>using namespace std;</code>, quand on code petit script ça peut passer mais ça reste effectivement une mauvaise pratique.</p>Problème avec c++, message #2247382020-08-07T17:22:48+02:00valerian.roura/@valerian.rourahttps://zestedesavoir.com/forums/sujet/14421/probleme-avec-c/?page=1#p224738<p>Je ne suis pas assez avancé dans le cours de C++ mais déjà petite chose qui pourrait aider les autres personnes sur ce site c’est de mettre ton code comme ça :</p>
<div class="hljs-code-div hljs-code-cpp"><div class="hljs-line-numbers"><span data-count="1"></span></div><pre><code class="hljs language-cpp">Ton Code
</code></pre></div>
<p>Si tu ne sait pas comment faire, cite mon message pour voir comment il est fait</p>Problème avec c++, message #2247362020-08-07T16:11:22+02:00Toinou88/@Toinou88https://zestedesavoir.com/forums/sujet/14421/probleme-avec-c/?page=1#p224736<p>Bonjour, je suis actuellement le très bon tutoriel de c++ sur le site. Cependant quand j’essaye de refaire un simple programme en sous-programmes, ça ne marche pas. Je suis au chapitre "Découpons du code - Les fichiers" et au sous- chapitre "Créons un lien". En fait quand je l’exécute ça me met que quoted est un identificateur introuvable, qu’il est n’a pas membre de 'std' et que namespace "std" n’a pas de membre quoted. Voici le code de mes fichiers ci-dessous :</p>
<p>Test.cpp</p>
<p>// On a besoin de iostream pour utiliser std::cout, std::quoted et std::endl.
#include <iostream>
// On inclut le fichier d’en-tête correspondant.
#include "Test.h"</p>
<p>// Par contre, comme 'test.hpp' inclut déjà '<string>', on n’a pas besoin de l’inclure de nouveau ici, dans le fichier source.</p>
<p>// On définit la fonction ici.
void afficher_message(std::string const & message)
{
std::cout « "J’ai reçu un message : " « std::quoted(message) « std::endl;
}</p>
<p>'’'
Test.h</p>
<p>#ifndef TEST_H
#define TEST_H</p>
<p>#include <string></p>
<p>void afficher_message(std::string const & message);</p>
<p>#endif
'’'
main.cpp</p>
<p>// Pour appeler la fonction, il faut connaître son prototype, donc on doit inclure le fichier d’en-tête correspondant.
#include "Test.h"</p>
<p>int main()
{
// Ici, on va utiliser la fonction.
afficher_message("Salut les lecteurs !");
return 0;
}</p>Exercice simple de programmation en Python, message #2210982020-05-22T10:44:04+02:00Baba31/@Baba31https://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=2#p221098<p>Finalement, j’ai réussi deux ou trois trucs:</p>
<div class="hljs-code-div"><div class="hljs-line-numbers"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></div><pre><code class="hljs language-py"><span class="hljs-keyword">from</span> quickpi <span class="hljs-keyword">import</span> *
Y=<span class="hljs-number">16</span>
X=<span class="hljs-number">56</span>
Tour=<span class="hljs-number">0</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">while</span> <span class="hljs-literal">True</span>:
<span class="hljs-keyword">if</span> isButtonPressed(<span class="hljs-string">"stick1.up"</span>):
Y=Y<span class="hljs-number">-2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
Direction=<span class="hljs-number">1</span>
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.down"</span>):
Y=Y+<span class="hljs-number">2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
Direction=<span class="hljs-number">2</span>
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.left"</span>):
X=X<span class="hljs-number">-2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
Direction=<span class="hljs-number">3</span>
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.right"</span>):
X=X+<span class="hljs-number">2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
Direction=<span class="hljs-number">4</span>
sleep(<span class="hljs-number">200</span>)
Tour=Tour+<span class="hljs-number">1</span>
connectToCloudStore(<span class="hljs-string">"l8A2PUAM"</span>, <span class="hljs-string">"MdpCaché"</span>)
writeToCloudStore(<span class="hljs-string">"l8A2PUAM"</span>, <span class="hljs-string">"tron1"</span>, <span class="hljs-string">"Tour + Direction"</span>)
</code></pre></div>
<p>Bien sûr ce n’est pas fini, je n’ai fait que le joueur 1 mais le problème c’est quand je me connecte à ma clé, la valeur que j’ai mise au début ne change pas. Est-ce un problème au niveau du code ?</p>Exercice simple de programmation en Python, message #2210882020-05-21T23:32:51+02:00Baba31/@Baba31https://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=2#p221088<p>Concrètement, voici la consigne exacte :</p>
<p>Modifiez le programme de la version précédente pour qu’il permette à deux joueurs de jouer en réseau. Chaque joueur contrôle un carré. Le joueur 1 commence en x=56 et y=16, et le joueur 2 en x=72 et y=16. Le joueur 1 joue en premier, au tour numéro 0. Le joueur 2 joue ensuite au tour 1, puis le joueur 1 au tour 2, et ainsi de suite.</p>
<p>Créez une clé "tron1" pour transmettre vos déplacements à votre adversaire. Lui devra créer une clé "tron2" pour vous envoyer les siens. Vous programmez le joueur 1. Après son déplacement, écrivez sur votre clé une liste composée de 2 valeurs : le numéro du tour et la direction de déplacement (1 pour haut, 2 pour bas, 3 pour gauche, 4 pour droite).</p>
<p>Lisez ensuite toutes les 100ms sur la clé de votre adversaire, une liste de deux valeurs : un numéro de tour et une direction. Lorsque le numéro de tour lu est le suivant de celui que vous aviez écrit, déplacez le carré de votre adversaire de 2 pixels dans la direction lue. Ensuite, attendez 100ms de plus et passez au tour suivant, en gérant le déplacement suivant du joueur 1.
Pour tester votre programme avec un véritable adversaire, celui qui est le joueur 2 devra bien sûr modifier son programme en conséquence.</p>
<p>Les fonctions disponibles pour contrôler le robot sont :
drawRectangle(x0, y0, width, height)
drawLine(x0, y0, x1, y1)
isButtonPressed(button) retourne True si le bouton est enfoncé, False sinon
sleep(milliseconds) met en pause l’exécution pendant une durée en ms
connectToCloudStore(identifier, password)
writeToCloudStore(identifier, key, value)
readFromCloudStore(identifier, key)</p>
<p>Les mots-clés suivants sont autorisés : variables, list, set, crochets [ ], def, lambda, while, if, else, elif, and, or.
Les mots-clés suivants sont interdits : for, not, accolades { }, break, continue, setattr, map, split.
Les variables sont autorisées.</p>
<p>Ce sont toutes les informations que j’ai. Concrètement, j’écris mon programme sur le site qui propose l’exercice et il m’indique ensuite si celui-ci fonctionne.</p>
<p>Pour faire le programme, je vais me baser sur l’autre déjà fait :</p>
<div class="hljs-code-div"><div class="hljs-line-numbers"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></div><pre><code class="hljs language-py"><span class="hljs-keyword">from</span> quickpi <span class="hljs-keyword">import</span> *
Y=<span class="hljs-number">16</span>
X=<span class="hljs-number">64</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">while</span> <span class="hljs-literal">True</span>:
<span class="hljs-keyword">if</span> isButtonPressed(<span class="hljs-string">"stick1.up"</span>):
Y=Y<span class="hljs-number">-2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.down"</span>):
Y=Y+<span class="hljs-number">2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.left"</span>):
X=X<span class="hljs-number">-2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.right"</span>):
X=X+<span class="hljs-number">2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
sleep(<span class="hljs-number">100</span>)
</code></pre></div>
<p>Je vais ensuite y faire les modifications nécessaires. Seulement, je ne suis pas sûr de comprendre bien l’énoncé et de savoir comment faire.
Pour commencer, je ne sais même pas que sont ces variables là :
connectToCloudStore(identifier, password)
writeToCloudStore(identifier, key, value)
readFromCloudStore(identifier, key)</p>
<p>surtout si ça ne t’intéresse pas.
Source:<a href="https://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=2#p221086">ache</a></p>
<p>Si, ça m’intéresse vraiment de savoir faire tout ça !
Merci d’avance.</p>Exercice simple de programmation en Python, message #2210862020-05-21T21:50:11+02:00ache/@achehttps://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=2#p221086<p>Salut, on aurait besoin de plus d’info et des infos claires.</p>
<p>Le réseau ne fonctionne pas vraiment comme ça. Tu as besoin d’une adresse IP et d’un port (on peut appeler ça une clé si on veut) pour communiquer (par exemple <code>10.0.0.11:1234</code>, où <code>10.0.0.11</code> est l’IP et <code>1234</code> est le port, <code>:</code> sépare l’IP et le port). Tout expliquer serait compliquer et tu n’as pas vraiment besoin de le savoir je pense, surtout si ça ne t’intéresse pas.</p>
<p>Comment on t’as demander de gérer le réseau ? Tu utilises quoi ? Tu as forcément plus d’infos.</p>Exercice simple de programmation en Python, message #2210722020-05-21T15:31:38+02:00Baba31/@Baba31https://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=2#p221072<p>En fait c’est en raiseau : ce qu’il faut faire c’est ça :
Chaque joueur contrôle un carré. Le joueur 1 commence en x=56 et y=16, et le joueur 2 en x=72 et y=16. Le joueur 1 joue en premier, au tour numéro 0. Le joueur 2 joue ensuite au tour 1, puis le joueur 1 au tour 2, et ainsi de suite.</p>
<p>Créez une clé "tron1" pour transmettre vos déplacements à votre adversaire. Lui devra créer une clé "tron2" pour vous envoyer les siens. Vous programmez le joueur 1. Après son déplacement, écrivez sur votre clé une liste composée de 2 valeurs : le numéro du tour et la direction de déplacement (1 pour haut, 2 pour bas, 3 pour gauche, 4 pour droite).</p>
<p>Lisez ensuite toutes les 100ms sur la clé de votre adversaire, une liste de deux valeurs : un numéro de tour et une direction. Lorsque le numéro de tour lu est le suivant de celui que vous aviez écrit, déplacez le carré de votre adversaire de 2 pixels dans la direction lue. Ensuite, attendez 100ms de plus et passez au tour suivant, en gérant le déplacement suivant du joueur 1. </p>Exercice simple de programmation en Python, message #2210592020-05-21T12:12:02+02:00Gabbro/@Gabbrohttps://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=1#p221059<p>Le réseau, c’est compliqué. Là, tu fais du deux joueurs temps réel sur la même machine, c’est moins compliqué, mais pas simple du tout pour autant. Ensuite, je t’invite à voir, pas à pas, ce que fait ton programme en suivant strictement les instructions que tu as écrite. Et à comparer à ce que tu veux faire.</p>Exercice simple de programmation en Python, message #2210472020-05-21T09:28:22+02:00Baba31/@Baba31https://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=1#p221047<p>Merci Ache : les elif je suis d’accord mais le reste change le programme et crée des bug.
Sinon pour améliorer mon programme je pourrais modifier le programme de la version précédente pour qu’il permette à deux joueurs de jouer en réseau. Chaque joueur contrôlerais un carré. Le joueur 1 commence par exemple en x=56 et y=16, et le joueur 2 en x=72 et y=16. Le joueur 1 joue en premier, au tour numéro 0. Le joueur 2 joue ensuite au tour 1, puis le joueur 1 au tour 2, et ainsi de suite.
Ça permettrait de faire une liste je pense mais comment faire pour qu’elle aille à l’infini, etc ?
J’ai réussi ça pour l’instant :</p>
<div class="hljs-code-div"><div class="hljs-line-numbers"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></div><pre><code class="hljs language-py"><span class="hljs-keyword">from</span> quickpi <span class="hljs-keyword">import</span> *
Y=<span class="hljs-number">16</span>
X=<span class="hljs-number">56</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">while</span> <span class="hljs-literal">True</span>:
<span class="hljs-keyword">if</span> isButtonPressed(<span class="hljs-string">"stick1.up"</span>):
Y=Y<span class="hljs-number">-2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.down"</span>):
Y=Y+<span class="hljs-number">2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.left"</span>):
X=X<span class="hljs-number">-2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.right"</span>):
X=X+<span class="hljs-number">2</span>
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
sleep(<span class="hljs-number">100</span>)
Y2=<span class="hljs-number">16</span>
X2=<span class="hljs-number">72</span>
drawRectangle(X2, Y2, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">while</span> <span class="hljs-literal">True</span>:
<span class="hljs-keyword">if</span> isButtonPressed(<span class="hljs-string">"stick1.up"</span>):
Y=Y<span class="hljs-number">-2</span>
drawRectangle(X2, Y2, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.down"</span>):
Y=Y+<span class="hljs-number">2</span>
drawRectangle(X2, Y2, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.left"</span>):
X=X<span class="hljs-number">-2</span>
drawRectangle(X2, Y2, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.right"</span>):
X=X+<span class="hljs-number">2</span>
drawRectangle(X2, Y2, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
sleep(<span class="hljs-number">100</span>)
</code></pre></div>
<p>Merci d’avance</p>Exercice simple de programmation en Python, message #2210452020-05-21T08:58:50+02:00ache/@achehttps://zestedesavoir.com/forums/sujet/14094/exercice-simple-de-programmation-en-python/?page=1#p221045<p>C’est pas mal !</p>
<p>On utilise généralement <code>elif</code> plutôt que seulement <code>if</code> quand les contritions s’excluent mutuellement. Ici l’utilisateur pourrait bouger son stick au bon moment pour aller en diagonal sinon. Avec <code>elif</code>, cela n’est plus possible.</p>
<p>Tu peux factoriser du code pour n’utiliser qu’un <code>drawRectangle</code>.</p>
<p>Sinon, c’est à peut prêt tout.</p>
<div class="hljs-code-div"><div class="hljs-line-numbers"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></div><pre><code class="hljs language-py"><span class="hljs-keyword">from</span> quickpi <span class="hljs-keyword">import</span> *
Y=<span class="hljs-number">16</span>
X=<span class="hljs-number">64</span>
<span class="hljs-keyword">while</span> <span class="hljs-literal">True</span>:
drawRectangle(X, Y, <span class="hljs-number">2</span>, <span class="hljs-number">2</span>)
sleep(<span class="hljs-number">50</span>)
<span class="hljs-keyword">if</span> isButtonPressed(<span class="hljs-string">"stick1.up"</span>):
Y=Y<span class="hljs-number">-2</span>
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.down"</span>):
Y=Y+<span class="hljs-number">2</span>
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.left"</span>):
X=X<span class="hljs-number">-2</span>
<span class="hljs-keyword">elif</span> isButtonPressed(<span class="hljs-string">"stick1.right"</span>):
X=X+<span class="hljs-number">2</span>
</code></pre></div>
<p>Me semble tout à fait fonctionnel.</p>