Aanraakinteracties in game-ontwikkeling voor Windows Phone 7 Part 2 Multitouch

Programmeren! - 2.Probeer multi-touch

Over dit voorbeeld

Hier wil ik graag het programma voor het realiseren van multi-touch input toelichten. In Windows Phone 7 is multi-touch-invoer via het aanraakscherm een van de belangrijkste items voor gebruikersinvoer. Dit komt omdat, in tegenstelling tot Windows en Xbox 360, de belangrijkste invoerinterface het "aanraakpaneel" is. Er zijn misschien Windows-telefoons met toetsenborden, maar die hebben ze natuurlijk niet altijd. Dus om het spel op elke Windows Phone te laten werken, moet het geschikt zijn voor aanraking.

Als u het aanraakpaneel beperkt tot alleen "single touch", zullen de soorten games die kunnen worden gemaakt onvermijdelijk beperkt zijn als het gaat om het maken van games. Denk aan een handheld game console (deze kun je stil laten staan). De meeste gameconsoles vereisen dat je de gamecontroller (of de eigenlijke console) met beide handen vasthoudt en tegelijkertijd op meerdere knoppen drukt.

Windows Phone 7 heeft niet zoveel knoppen als gamecontrollers en heeft niet noodzakelijkerwijs een toetsenbord. Daarom kunnen virtuele toetsen en knoppen op het scherm worden geplaatst en wanneer u erop drukt, is het onhandig omdat ze niet tegelijkertijd kunnen worden ingedrukt met slechts één aanraking.

Natuurlijk, naast het voorbeeld van de virtuele knop hierboven, is multi-touch nodig voor games waarbij meerdere mensen één scherm bedienen, zoals "knijpen en strekken (twee punten dichter of verder uit elkaar bewegen)" dat gebruikelijk is in multi-touch.

Trouwens, de inleiding is lang, maar in dit voorbeeld wil ik graag multi-touch informatie verkrijgen met behulp van een klas gewijd aan aanraakpanelen. Het is leuk om een sample te maken die ineens met multi-touch gespeeld kan worden, maar eerst wil ik graag weten wat voor soort informatie er met multi-touch verkregen kan worden. Er zijn enkele gewoonten, dus door ze eerst te kennen, kunt u de tijd die u besteedt aan het onderzoeken van de oorzaak verminderen, zoals wanneer het later niet goed werkt in het programmeren.

Doelen van dit voorbeeldprogramma

Geef de informatie weer en bevestig deze wanneer multi-touch wordt uitgevoerd.

Figuur 1: Aanraakinformatie wordt weergegeven als tekst wanneer deze wordt aangeraakt

Programma - Velden declareren

De velden moeten het label TouchPanelCapabilities Structure en TouchCollection Structure hebben.

/// <summary>
///  スプライトでテキストを描画するためのフォント
/// </summary>
SpriteFont font;

/// <summary>
///  タッチパネルの機能情報
/// </summary>
TouchPanelCapabilities capabilities;

/// <summary>
///  取得したタッチ情報の一覧
/// </summary>
TouchCollection touches;

De "TouchPanelCapabilities-structuur" is een structuur die de functies van het aanraakpaneel zelf als parameters kan hebben. Het wordt gebruikt om te controleren of het aanraakscherm kan worden gebruikt tijdens het bijwerken.

De TouchCollection-structuur bevat een lijst met informatie over de status die momenteel is aangeraakt. Als er meerdere aanrakingen worden gedetecteerd, kunnen meerdere "TouchLocation-structuren" worden opgehaald. Daarover later meer.

Programma - Lettertypen laden

Voordat u tekst op het scherm tekent, voegt u de lettertypedefinitie toe aan uw inhoudsproject en laadt u deze met de methode Game.LoadContent. Dit heeft niet direct te maken met touch panels, dus ik zal een gedetailleerde uitleg weglaten.

Afbeelding 2: "Font.spritefont" toevoegen aan uw inhoudsproject

// フォントをコンテンツパイプラインから読み込む
font = Content.Load<SpriteFont>("Font");

Programma - Informatie over het aanraakscherm ophalen

Haal de informatie op het aanraakscherm op in de methode Game.Update.

// タッチパネルの機能情報を取得
capabilities = TouchPanel.GetCapabilities();

// タッチパネルが使用可能であるかチェック
if (capabilities.IsConnected)
{
  // 現在のタッチパネルの入力情報を取得
  touches = TouchPanel.GetState();
}

U kunt de methode "TouchPanel.GetCapabilities" aanroepen om de functie-informatie van het aanraakscherm te krijgen. Er zijn twee soorten informatie die kunnen worden verkregen: "Kan het aanraakpaneel worden gebruikt?" en "Maximaal aantal aanraakpunten dat door het aanraakpaneel kan worden verkregen." Geen van beide verandert tijdens het spel, dus ik denk dat er geen probleem is als je het volgens de Game.Initialize-methode krijgt, maar in de toekomst verschijnen apparaten die het aanraakpaneel kunnen verwijderen (aanraakscherm dat kan worden aangesloten op USB of echte andere apparaten dan Windows Phone) en het wordt beschreven in de updatemethode.

Het is ook niet nodig om te controleren of het aanraakscherm kan worden gebruikt, omdat het altijd kan worden gebruikt op Windows Phone 7, maar bij het delen van code met Windows en Xbox 360 zijn deze hardware geen vereiste invoerinterfaces en moeten ze worden gecontroleerd.

Als u kunt bevestigen dat het aanraakpaneel beschikbaar is in de eigenschap "TouchPanelCapabilities.IsConnected", krijgt de methode "TouchPanel.GetState" de huidige aanraakstatus.

Oorspronkelijk wordt enige bewerkingsverwerking uitgevoerd na het verkrijgen van aanraakinformatie, maar in dit voorbeeld wordt alleen informatie weergegeven, dus er wordt geen verdere verwerking uitgevoerd in de game.update-methode.

Programma - Krijg het maximale aantal touchpoints dat u kunt krijgen

Het maximale aantal touchpoints dat kan worden opgehaald, is ongeveer vast, dus het is niet vaak nodig om ze tijdens het spel op te halen, maar je kunt het maximale aantal touchpoints krijgen dat kan worden opgehaald uit de eigenschap TouchPanelCapabilities.MaximumTouchCount. Als de eigenschap MaximumTouchCount bijvoorbeeld "4" is, kunt u de informatie over de vijfde positie niet ophalen door het aanraakscherm met vijf vingers aan te raken.

Het aantal aankopen voor de smartphone "HTC 7 Trophy" die in deze steekproef werd gebruikt, was "4". (Overigens is XNA Game Studio 4.0 gedefinieerd om altijd 4 te retourneren.) De Windows Phone 7-specificatie zegt dat het meer dan 4 punten is, dus het retourneert niet minder dan 4.)

// タッチ可能な最大数を表示
spriteBatch.DrawString(font,  
                       "MaximumTouchCount : " +
                         capabilities.MaximumTouchCount,
                       new Vector2(20, 50),
                       Color.LightGreen);

Figuur 3: TouchPanelCapabilities.MaximumTouchCount Property Retrieval Count

Programma - Touch-informatie opvragen

De opgehaalde TouchCollection-structuur bevat meerdere aanraakinformatie. Als u bijvoorbeeld met twee vingers aanraakt, bevat deze meestal twee aanrakingen.

Het aantal aanraakgegevens kan worden opgehaald in de eigenschap TouchCollection.Count. Aanraakinformatie wordt herhaaldelijk weergegeven in de for-instructie, net zo vaak als deze wordt verkregen. Oorspronkelijk is er geen probleem om met foreach te loopen, maar omdat we de array-index (int-index) in de latere uitleg zullen gebruiken, herhalen we het met voor.

// タッチ情報の数だけループする
for (int index = 0; index < touches.Count; index++)
{
  // 指定したインデックスのタッチ情報取得
  TouchLocation tl = touches[index];

  // タッチ情報を可視化
  string mes = "Index : " + index + Environment.NewLine +
               "Id : " + tl.Id + Environment.NewLine +
               "Position : " + tl.Position + Environment.NewLine +
               "State : " + tl.State;

  // 文字の描画
  spriteBatch.DrawString(font,
                         mes,
                         new Vector2(30 + (index % 4) * 10,
                                     80 + index * 140),
                         Color.White);
}

Nu wordt elke aanraakinformatie verkregen als een "TouchLocation" -structuur. Als het looping is met for, kan het worden verkregen met "TouchCollection[index]". (U kunt de structuur "TouchLocation" ook direct in de voorpagina krijgen.)

De volgende vier soorten informatie kunnen worden verkregen uit de "TouchLocation"-structuur en elke informatie wordt weergegeven in het voorbeeld.

Wanneer u het daadwerkelijk uitvoert, wordt de aanraakinformatie weergegeven zoals hieronder weergegeven. Omdat je met drie vingers aanraakt, kun je drie aanrakingen zien. Trouwens, als je met vijf vingers aanraakt, zie je er maar vier. (Omdat het maximum aantal overnames 4 is)

Figuur 4: Aanraken met drie vingers

Programma - Dingen om op te letten bij het ophalen van aanraakinformatie 1 (index en ID)

Ik heb hierboven vermeld dat er dingen zijn om in gedachten te houden bij het omgaan met aanraakinformatie, maar de eerste is "index" en "ID". Een index verwijst simpelweg naar een array-index.

Ik denk dat het gemakkelijker te begrijpen is als je het op een echte machine probeert dan het schriftelijk uit te leggen. Laten we bijvoorbeeld zeggen dat u met twee vingers werkt, "wijsvinger" en "middelvinger", en eerst met uw wijsvinger aanraakt.

Figuur 5: Aanraken met wijsvinger

Zoals op het scherm wordt weergegeven, is de index "0". Raak het dan aan met je middelvinger.

Figuur 6: Aanraking van de middelvinger

In deze toestand raak je aan met twee vingers, dus er worden twee stukjes informatie weergegeven. De wijsvinger die met de middelvinger wordt aangeraakt is "1".

Laten we hier onze wijsvinger opsteken. Dan ziet de aanraakinformatie er als volgt uit.

Figuur 7: Laat je wijsvinger los

Zoals je misschien al hebt gemerkt, is de index van de informatie die je met je middelvinger aanraakt "0". Als u het teken per index beheert wanneer u het verplaatst, leidt de bovenstaande bewerking tot de volgende acties.

・ Verplaats het teken "A" met uw wijsvinger
↓
・ Verplaats het teken "B" met de middelvinger in die toestand.
↓
・ Laat de wijsvinger los terwijl u het teken met de middelvinger beweegt
↓
・ Het personage dat door de middelvinger wordt bestuurd, schakelt plotseling over naar "A"

Een ander fenomeen is dat als u herhaaldelijk een van de twee vingers loslaat of aanraakt terwijl u ze aanraakt, de tekentekst van de eerste aanraakinformatie kan flikkeren. Dit komt omdat de tweede vinger de wijsvinger "0" onderbreekt op het moment dat u deze aanraakt of loslaat.

Zoals hierboven vermeld, komen de index en de volgorde van aanraakinformatie bij multi-touch niet overeen met de volgorde waarin ze worden aangeraakt. Als u bewerkingen wilt uitvoeren, moet u deze daarom niet beheren in de TouchCollection-index.

Wat moet worden beheerd, is dat de "TouchLocation" -structuur een eigenschap "Id" heeft en dat de Id wordt herschreven met een nieuwe waarde elke keer dat deze wordt aangeraakt, maar de relatie tussen het aanraakpunt en de ID is gegarandeerd tijdens het aanraken, dus we zullen het beheren.

Dit betekent natuurlijk niet dat u het per ID moet beheren, en in sommige gevallen is de aanraakpositie alleen voldoende. Als u bijvoorbeeld gewoon een knop op het scherm aanraakt, kunt u vaststellen dat u op een knop hebt gedrukt door de aanraakpositie te controleren, ongeacht de ID. Bij het opnemen van sleepverwerking verandert de positie echter altijd, dus ik denk dat deze nog steeds door ID moet worden bepaald.

Programma - Dingen om in gedachten te houden bij het verkrijgen van aanraakinformatie 2 (aantal verkregen aanraakinformatie)

Hoewel het niet is opgenomen in het programma van het artikel, tekent het voorbeeld de tekenreeks "GetMaxTouchCount" onderaan het scherm en "het maximale aantal aanraakinformatie dat tegelijkertijd is verkregen". Dit heeft in het verleden het maximale aantal aanraakinformatie weergegeven dat is verkregen door de methode "TouchPanel.GetState", maar in deze testmachine is de eigenschap "TouchPanelCapabilities.MaximumTouchCount" 4, dus de maximale waarde die hier wordt weergegeven, moet meestal 4 zijn. Als je er vijf vingers op legt, zijn het er nog steeds 4.

Figuur 8: Nummer met vijf vingers

Laten we een klein experiment doen. Probeer het aanraakscherm met meerdere vingers op hoge snelheid te herhalen. Het hangt af van de testmachine, maar het aantal kan groter zijn dan 4 voordat je het weet.

Figuur 9: GetMaxTouchCount is groter dan 4

In feite is de aanraakinformatie die wordt verkregen door de "TouchPanel.GetState" -methode niet de aanraakinformatie op het moment dat u de "TouchPanel.GetState" -methode aanroept, maar het moment dat u het aanraakt en het moment waarop u het loslaat van de laatste updatetiming worden opgeslagen. Daarom, hoewel er maximaal vier aanrakingen tegelijkertijd kunnen worden gedetecteerd, wordt het opnieuw aanraken van dezelfde vinger behandeld als een afzonderlijke aanraking, zodat meer aanraakinformatie kan worden verkregen dan TouchPanelCapabilities.MaximumTouchCount.

Daarom, zelfs als TouchPanelCapabilities.MaximumTouchCount 4 is, als het aantal matrixelementen van aanraakgerelateerde gegevens is vastgesteld door 4, kan er een indexoverschrijdingsfout optreden, afhankelijk van de verwerkingsmethode.

Trouwens, in de hulp van XNA Game Studio wordt de maximale waarde van de eigenschap TouchCollection.Count beschreven als "8", dus als u het aantal elementen in de array wilt vastleggen, moet u het aantal elementen instellen op ten minste 8. (Als u nadenkt over toekomstige versie-upgrades, kunt u een bewakingsclausule opnemen zodat de index niet overgaat.)

Samenvatting van deze steekproef

Deze keer hebben we verschillende parameters onderzocht voor de informatie verkregen uit multi-touch. We hebben ook bevestigd dat er enkele punten zijn om in gedachten te houden bij het verkrijgen van aanraakscherminformatie. Op basis van deze kennis wil ik graag een voorbeeld toelichten dat daadwerkelijk gebruik maakt van multi-touch.