Zum Inhalt springen

Erstellen von flüssigen Links/Rechts-Button-Steuerungen für Mobilgeräte

💡 Haben Sie Probleme beim Zusammensetzen von Scratch-Blöcken? Wissen Sie nicht, wie Sie Code-Logik implementieren? 🚀 Get Help Now

MA

MobileDev_Alex

Posted on August 1, 2024 • Intermediate

📱 Brauche Hilfe bei flüssigen mobilen Steuerungen

Ich erstelle ein Plattform-/Geschichtenspiel und muss mobile Unterstützung hinzufügen, da ich auf dem Handy entwickle. Das Spiel wird sowohl Tastatur- als auch mobile Steuerungen haben. Ich weiß bereits, wie man Tastatursteuerungen macht, aber ich habe Schwierigkeiten beim Erstellen von flüssigen Links/Rechts-Buttons, die sich nicht ruckelig anfühlen.

Die Hauptprobleme, mit denen ich konfrontiert bin:

  • Button-Drücke fühlen sich träge und nicht reagierend an
  • Bewegung ist ruckelig statt flüssig
  • Brauche sowohl visuelles Feedback als auch flüssige Charakterbewegung

Jede Hilfe beim Erstellen professionell wirkender mobiler Steuerungen wäre fantastisch! 🙏

TC

TouchControl_Expert

1 Stunde später geantwortet • ⭐ Beste Antwort

Großartige Frage @MobileDev_Alex! Das Erstellen flüssiger mobiler Steuerungen ist entscheidend für eine gute Benutzererfahrung. Hier ist eine umfassende Lösung, die alle Ihre Anliegen anspricht:

🎮 Schritt 1: Button-Figuren erstellen

Erstellen Sie zunächst zwei Button-Figuren (Linker Button und Rechter Button) mit jeweils zwei Kostümen:

  • Kostüm 1: Normaler Zustand (nicht gedrückt)
  • Kostüm 2: Gedrückter Zustand (dunkler/hervorgehoben)

📱 Schritt 2: Visuelles Button-Feedback

Für jede Button-Figur fügen Sie diesen Code für visuelles Feedback hinzu:

    when flag clicked
forever
if <<touching [mouse-pointer v]?> and <mouse down?>> then
switch costume to [pressed v]
broadcast [button pressed v] // or [left pressed v] / [right pressed v]
else
switch costume to [normal v]
broadcast [button released v] // or [left released v] / [right released v]
end
end
  

🏃 Schritt 3: Flüssige Charakterbewegung

Für Ihren Spielercharakter implementieren Sie dieses flüssige Bewegungssystem:

    when flag clicked
set [movement speed v] to [0]
set [max speed v] to [8]
set [acceleration v] to [1]
set [friction v] to [0.8]

forever
// Handle input
if <<key [left arrow v] pressed?> or <[left pressed v] = [true]>> then
change [movement speed v] by (0 - [acceleration v])
end
if <<key [right arrow v] pressed?> or <[right pressed v] = [true]>> then
change [movement speed v] by [acceleration v]
end

// Apply friction when no input
if <<<not <key [left arrow v] pressed?>> and <not <key [right arrow v] pressed?>>> and <<[left pressed v] = [false]> and <[right pressed v] = [false]>>> then
set [movement speed v] to ((movement speed) * [friction v])
end

// Limit speed
if <(movement speed) > [max speed v]> then
set [movement speed v] to [max speed v]
end
if <(movement speed) < (0 - [max speed v])> then
set [movement speed v] to (0 - [max speed v])
end

// Apply movement
change x by [movement speed v]
end
  

🔄 Schritt 4: Button-Zustandsverwaltung

Erstellen Sie Variablen zur Verfolgung der Button-Zustände:

    when flag clicked
set [left pressed v] to [false]
set [right pressed v] to [false]

when I receive [left button pressed v]
set [left pressed v] to [true]

when I receive [left button released v]
set [left pressed v] to [false]

when I receive [right button pressed v]
set [right pressed v] to [true]

when I receive [right button released v]
set [right pressed v] to [false]
  

✨ Schritt 5: Erweiterte flüssige Bewegung

Für noch flüssigere Bewegung mit Beschleunigung und Verzögerung:

    // Advanced movement with ramp-up and ramp-down
when flag clicked
set [speed ramp v] to [0]
set [is moving v] to [false]

forever
set [is moving v] to [false]

if <<key [left arrow v] pressed?> or <[left pressed v] = [true]>> then
set [is moving v] to [true]
point in direction [-90]
if <[speed ramp v] < [8]> then
change [speed ramp v] by [0.5]
end
end

if <<key [right arrow v] pressed?> or <[right pressed v] = [true]>> then
set [is moving v] to [true]
point in direction [90]
if <[speed ramp v] < [8]> then
change [speed ramp v] by [0.5]
end
end

if <[is moving v] = [true]> then
move [speed ramp v] steps
else
// Decelerate when not moving
if <[speed ramp v] > [0]> then
change [speed ramp v] by [-0.3]
move [speed ramp v] steps
else
set [speed ramp v] to [0]
end
end
end
  

Dies erzeugt ein professionelles Gefühl mit flüssiger Beschleunigung und Verzögerung! 🚀

MA

MobileDev_Alex

Replied 2 hours later

@TouchControl_Expert Das ist unglaublich! Vielen Dank! 🎉

Die Bewegung fühlt sich jetzt viel flüssiger an. Eine Frage - wie kann ich visuelle Effekte hinzufügen, wenn sich der Charakter bewegt, wie Staubpartikel oder Animationsänderungen?

VE

VisualEffects_Pro

Replied 1 hour later

@MobileDev_Alex Großartige Frage! So fügen Sie visuellen Glanz hinzu:

    // Add this to your player sprite for animation
when flag clicked
forever
if <[is moving v] = [true]> then
if <[speed ramp v] > [2]> then
switch costume to [running v]
create clone of [dust particle v]
else
switch costume to [walking v]
end
else
switch costume to [idle v]
end
end

// For dust particles (separate sprite)
when I start as a clone
go to [player v]
change y by [-20]
set [ghost v] effect to [50]
repeat [10]
change y by [2]
change [ghost v] effect by [5]
end
delete this clone
  

Das fügt Laufanimationen und Staubeffekte für zusätzlichen Glanz hinzu! ✨

VB

Vibelf_Community

Pinned Message • Moderator

🚀 Möchten Sie Mobile Game Development meistern?

Exzellente Diskussion über mobile Steuerungen! Für diejenigen, die noch fortgeschrittenere mobile Spiele erstellen möchten, kann unsere Community Ihnen bei der Implementierung helfen:

  • 📱 Multi-Touch-Gestensteuerung
  • 🎮 Virtuelle Joystick-Systeme
  • ⚡ Leistungsoptimierung für mobile Geräte
  • 🎨 Responsives UI-Design

📚 Verwandte Themen

Bereit, professionelle mobile Spiele zu erstellen? Holen Sie sich Expertenberatung von unseren Tutoren in der Vibelf-App!