3 Stimmen

Wie erstellt man ein Klavier-UI auf dem Iphone?

Ich bin ein Neuling in der Erstellung solcher klavierbasierten UI-Anwendungen. Ich entwickle eine Anwendung, in der ich Klavier verwenden muss. Wie kann man Piano UI in Iphone erstellen? Wie man es mit Interface Builder erstellen? oder gibt es einen anderen Weg, um das Klavier zu erstellen?

Ich bin in der dringenden Notwendigkeit, solche UI zu erstellen, wenn jeder Körper hat jede Lösung oder jede nützliche Code oder jeder Link, die geschätzt werden würde.

Danke! Niraj

9voto

Tyler Punkte 27980

Version 1 Einfacher zu codieren, nicht so elegant.

Starten Sie ein ansichtsbasiertes Projekt in Xcode, und verwenden Sie Interface Builder, Bearbeiten MyProjectViewController.xib , um eine Reihe von Tasten in Formen und Farben zusammenzustellen, die einer Bildschirmtastatur ähneln.

bearbeiten MyProjectViewController.h y .m um eine Reihe von Methoden mit Signaturen wie dieser hinzuzufügen:

- (IBAction) playMiddleC: (id) sender;
- (IBAction) playMiddleD: (id) sender;
- (IBAction) playMiddleE: (id) sender;

Jetzt können Sie zum Interface Builder zurückkehren und mit der rechten Maustaste auf jede Schaltfläche klicken und sie auf das Objekt File's Owner (vom Typ MyProjectViewController ). Wenn Sie dies tun, erscheint ein Menü, in dem Sie gefragt werden, mit welcher Methode die Taste verbunden werden soll. Wählen Sie die entsprechende Methode für diese Taste.

Fügen Sie nun für jede der Tasten, die Sie spielen möchten, eine Sounddatei hinzu. Nehmen wir zum Beispiel an, Sie haben eine Datei namens midC.caf (z. B. im linearen PCM-Format kodiert, als eine der die gültigen Tondateiformate ). Kopieren Sie diese Datei in Ihr Projektverzeichnis und fügen Sie sie dem Projekt hinzu, indem Sie (in Xcode) mit der rechten Maustaste auf den Ordner "Resources" klicken und "Add > Existing Files " wählen und dann Ihre Sounddatei auswählen.

Als nächstes müssen Sie die AudioToolbox-Bibliothek als Abhängigkeit hinzufügen. Klicken Sie dazu mit der rechten Maustaste auf den Ordner "Frameworks" und wählen Sie "Hinzufügen" > "Vorhandene Frameworks" und suchen Sie dann die AudioToolbox-Bibliothek und wählen Sie sie aus.

In der Zwischenzeit, zurück in MyProjectViewController.m fügen Sie den folgenden Code hinzu:

#import <AudioToolbox/AudioServices.h>

// (Later...)

- (IBAction) playMiddleC: (id) sender {
  NSString* path = [[NSBundle mainBundle]
                    pathForResource:@"midC" ofType:@"caf"];
  NSURL* url = [NSURL URLWithString:path];
  SystemSoundID midC;
  AudioServicesCreateSystemSoundID((CFURLRef)url, &midC);
  AudioServicesPlaySystemSound(midC);
}

Drücken Sie Command-Enter zum Kompilieren und Ausführen, und machen Sie Musik!

Version 2 Ein wenig eleganter.

Programmatisch konstruieren eine Tastatur UI mit einem Array für weiße Tasten, und ein anderes für schwarze (da sie leicht unterschiedliche Koordinaten haben). Ich empfehle die Verwendung von benutzerdefinierten UIButton Typen mit Bildern für gedrückte und nicht gedrückte Versionen jedes Tastentyps (schwarz, C/F, B/E und A/D/G, die mittlere weiße Tasten sind - ich berücksichtige hier die Tasteneinzüge).

Dies würde es Ihnen ermöglichen, Zeiger auf diese Tasten in einem Array zu speichern, und haben eine einzige Methode, die den Ton für jede Taste spielen könnte, indem auch Sound-IDs in einem entsprechenden Array gespeichert.

Man könnte meinen, dass man die Klänge programmatisch erstellen sollte, da sie eher mathematischer Natur sind. Aber die AudioQueue Dienste, die Sie dazu verwenden würden, sind wesentlich aufwändiger als der obige Code, so dass ich eigentlich nur die Verwendung von Soundbytes empfehlen würde, selbst in einer "eleganten" Version. Vielleicht klingt es auf diese Weise sogar besser.

Übrigens Ihre Frage hört sich so an, als ob Sie dies als eine schnelle und einfache Einstiegsanwendung betrachten, aber ich bin mir da nicht so sicher. Das Entwickeln von iPhone-Apps macht Spaß, erfordert aber viel Zeit und Mühe, um gut zu sein. Wenn du an Ideen für Einsteiger-Apps interessiert bist, würde ich vorschlagen, nach Dingen zu suchen, die eine neue Programmierfertigkeit nach der anderen trainieren, wie z. B. das Erlernen der Arbeit mit dem allgegenwärtigen UITableView oder eine schnelle App, mit der Sie ein Foto aufnehmen und an eine E-Mail anhängen können (das ist einfach, weil das iPhone SDK eine großartige Unterstützung für das Aufnehmen von Fotos und das Verfassen von E-Mails bietet).

Viel Spaß!

2voto

Niraj Punkte 362

Danke für die Antwort...

Ich bin fast fertig mit der Entwicklung der Benutzeroberfläche des Klaviers.

Ich habe einen programmatischen Ansatz verwendet, um schwarze und weiße Tasten zu erstellen.

CGFloat buttonWhitePosX = 2.0; //white button start position
for(int i=0;i<8;i++){ //8 keys in one octave
    CGFloat buttonWhitePosY = 105;
    CGFloat buttonWhiteWidth = 57;
    CGFloat buttonWhiteHeight = 190;

    UIButton *buttonWhite = [[UIButton alloc] initWithFrame:CGRectMake(buttonWhitePosX, buttonWhitePosY, buttonWhiteWidth, buttonWhiteHeight)];
    buttonWhitePosX = buttonWhitePosX + WHITE_BUTTON_SPACE + buttonWhiteWidth;
    [buttonWhite setBackgroundImage:whiteImage forState:UIControlStateNormal];
    [buttonWhite addTarget:self action:@selector(pressButtonWhiteTouchDown:) forControlEvents:UIControlEventTouchDown];

    buttonWhite.tag = i;
    [buttonWhite setBackgroundImage:whiteImageHighlighed forState:UIControlEventTouchDragInside];
    [self.view addSubview:buttonWhite];
    [buttonWhite release];

}

Dasselbe gilt für schwarze Tasten mit anderen Koordinaten.

Außerdem kann ich mit dem AVPlayer einen Ton auf Tastendruck abspielen (wenn der Selektor gedrückt wird).

So weit, so gut, aber wenn der Benutzer über die Tasten gleitet, sollte das Klavier einen respektierten Ton spielen.

Dies wird versucht zu erreichen mit

1) Verwendete UIControl-Ereignisse für UIButton. DragEnter, Drag Exit, Drag Inside. Aber es wird mir nicht geben, welche Taste genau gedrückt wird, da die Position des Ziehen-Ausgangs liegt weit außerhalb der gezeichneten Schaltfläche

2) Verwendet touchesBegan, touchesEnded, touchesMoved der Hauptansicht (in der schwarze und weiße Tasten platziert sind).

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
    UITouch *touch = [[event allTouches] anyObject];
    CGPoint touchLocation = [touch locationInView:touch.view];
    currentView = [self.view hitTest:touchLocation withEvent:nil]; //get top view
    if(currentView != self.view){ //check current view is main view, do nothing
        if(currentView == prevView){ //check current view is prev view, keep highlight image
            currentView.backgroundColor = [UIColor colorWithPatternImage:whiteImageHighlighed];
        }else{ //view changed, change image and play sound
            prevView.backgroundColor = [UIColor colorWithPatternImage:whiteImage];
            currentView.backgroundColor = [UIColor colorWithPatternImage:whiteImageHighlighed];
            [self pressButtonWhiteDown1:currentView.tag];
            prevView = currentView;
        }
    }
}

Bei diesem Ansatz ergibt sich eine falsche Ansicht, wenn der Benutzer über die weißen Tasten gleitet und auf die X-Position der schwarzen Tasten stößt (da die schwarze Taste in der Hauptansicht über der weißen Taste liegt):

Alt-Text http://img215.yfrog.com/img215/1720/pianohelp.png

Gibt es irgendeinen anderen Ansatz oder etwas, das ich falsch mache. bitte führen Sie mich.

Ist es möglich, eine genaue Ansicht vom Berührungspunkt zu erhalten?

Danke.

1voto

mahboudz Punkte 39008

Eine Möglichkeit wäre, eine Klaviertastatur zu fotografieren und die Bilder als Ausgangspunkt zu verwenden.

Eine andere Möglichkeit wäre, die Tasten in Photoshop oder einer anderen Anwendung zu zeichnen, sowohl in der Standard- als auch in der gedrückten Position, und diese als Basis zu verwenden.

Suchen Sie im App-Store und schauen Sie sich die verschiedenen Arten an, wie Klaviertastaturen implementiert wurden. Es gibt einige, und einige sehen realistischer aus als andere.

Eine gute Darstellung einer Klaviertastatur wird nicht einfach sein, vor allem wenn man versucht, das glänzende Aussehen der Tasten zu erhalten und realistische Bewegungen durch Animation zu erzeugen, aber es ist machbar. Zumindest sollten Sie Folgendes studieren Quarz 2D und möglicherweise etwas CAAnimation.

0voto

Tristan Punkte 3000

Ich habe etwas sehr Ähnliches gemacht. Ich habe normale Knöpfe mit den runden Ecken verwendet und jeden von ihnen einen WAV-Sound abspielen lassen. Es funktioniert gut!

0voto

Don Grem Punkte 1247

Sie können Klaviertastensounds von hier bekommen: http://www.sonicspot.com/news/free-musical-instrument-samples.html . Die Dateien sind ziemlich groß, Sie können sie mit Audacity schneiden und als .wav exportieren

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X