UE4 Gameplay Ability System で2Dコンボ攻撃（2/2）実装編

#つづき
[**前記事≫UE4 Gameplay Ability System で2Dコンボ攻撃（1/2）導入編**](https://qiita.com/O_Y_G/items/30c2d5618a3bdfbd649d)
からの続きになります。GASを使った2Dコンボ攻撃を実装していきたいと思います。

#5. コンボ攻撃用セットアップ
この項目以降の内容は、
[**[UE4]GameplayAbilitySystemでコンボ攻撃を作る｜株式会社ヒストリア様**](https://historia.co.jp/archives/15422/)
こちらの記事を元に、PaperCharacter用に変換して作業していきます。

##新規C++クラス
![qiita_gas_111.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/a159a32c-557c-7a1a-e4eb-9c658f25340c.jpeg)
C++のフォルダの中で、右クリック【新規C++クラス】

![qiita_gas_112.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/9317c06c-91dc-fcdc-6d25-f02e59fe34bc.jpeg)
【全てのクラスを表示】をチェック【gameplayability】で検索　【GameplayAbility】を選択　【次へ】

![qiita_gas_113.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/44bc76cf-d377-a2e9-b25a-8f242084b9bd.jpeg)
ファイル名を【Combo_GameplayAbility（任意）】にして、【クラスを作成】

![qiita_gas_114.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/8a24547a-d30c-5c6f-4a2c-31573d0303e6.jpeg)
出来た、白い帯の【Combo_GameplayAbility】をダブルクリック。


##Combo_GameplayAbility.h
コピペします。

```cpp:Combo_GameplayAbility.h

#pragma once
 
#include "CoreMinimal.h"
#include "Abilities/GameplayAbility.h"
#include "Combo_GameplayAbility.generated.h"

UCLASS()
class GAS_SPRITE_API UCombo_GameplayAbility : public UGameplayAbility
{
GENERATED_BODY()
 
/** AbilitySystemComponentのGameplayTagCountContainerに新しいGameplayTagを追加する */
UFUNCTION(BlueprintCallable, Category = "GamePlayAbility")
virtual void AddGameplayTags(const FGameplayTagContainer GameplayTags);
 
/** AbilitySystemComponentのGameplayTagCountContainerのGameplayTagを削除する */
UFUNCTION(BlueprintCallable, Category = "GamePlayAbility")
virtual void RemoveGameplayTags(const FGameplayTagContainer GameplayTags);
 
};
```
別の名前で作っている場合は、
【GAS_SPRITE】をプロジェクト名に置き換え
【Combo_GameplayAbility】をファイル名に置き換え

##Combo_GameplayAbility.cpp
コピペします。

```cpp:Combo_GameplayAbility.cpp

#include "Combo_GameplayAbility.h"
#include "AbilitySystemComponent.h"
 
void UCombo_GameplayAbility::AddGameplayTags(const FGameplayTagContainer GameplayTags)
{
UAbilitySystemComponent* Comp = GetAbilitySystemComponentFromActorInfo();
 
Comp->AddLooseGameplayTags(GameplayTags);
}
 
void UCombo_GameplayAbility::RemoveGameplayTags(const FGameplayTagContainer GameplayTags)
{
UAbilitySystemComponent* Comp = GetAbilitySystemComponentFromActorInfo();
 
Comp->RemoveLooseGameplayTags(GameplayTags);
}
```
別の名前で作っている場合は、
【Combo_GameplayAbility】をファイル名に置き換え

これで、BPからAbilityTagの追加/削除ができるようになるようです。
詳しくは、[[UE4]GameplayAbilitySystemでコンボ攻撃を作る｜株式会社ヒストリア](https://historia.co.jp/archives/15422/)をご参照ください。

#6.下準備
##フォルダ作成
【コンテンツ】フォルダ直下に、新規フォルダを作成【Add（任意）】このフォルダに、新規作成データを入れていきます。
【Blueprint（任意）】フォルダを作成、中に【GameplayAbility（任意）】と【BPInterface（任意）】フォルダを作成。

##ブループリントインターフェース作成
【BPInterface】フォルダの中で、右クリックから、【ブループリント】＞【ブループリントインターフェース】を選択
![qiita_gas_120.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/cae2a064-b964-1817-e73d-d1d34204c577.jpeg)
ファイル名を【BPI_Player】にします。
![qiita_gas_121.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/8687344d-dc3d-d361-d1fa-16182c9ba3ed.jpeg)
ダブルクリックで開いて、
![qiita_gas_123.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/2348c9a6-a7cb-15fb-4cc0-c7be994c8802.jpeg)

- 関数追加
    - BPI_Player_Combo
    - BPI_Player_Combo_End
    - BPI_Player_Combo_Damage
    - BPI_Player_Combo_Damage_End
        - インプット追加
            - AttackCombo 【Integer】（BPI_Player_Combo_Damage_Endは、インプット要りません。）
        - アウトプット追加
            - NewParam 【Boolean】 （ここは、アウトプットピンを追加したいだけなので、名前も型も何でもいいです。）
            - アウトプットピンを追加すると、BPIが関数として扱えるようになります。


##キャラクター複製
【Blueprints】フォルダの【2DSideScrollerCharacter】を右クリックから【複製】
ファイル名を【BP_PaperCharacter（任意）】にします。
![qiita_gas_119.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/cdeea8e6-3a56-b857-533c-41560e3b8490.jpeg)
【BP_PaperCharacter】を【Add】＞【Blueprint】に移動させます。
移動させた、【BP_PaperCharacter】を開いて、【クラス設定】【インターフェース】に【BPI_Player】を追加します。
![qiita_gas_122.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/25c88534-2935-d25a-0ece-7687db602c2d.jpeg)




#7. コンボ1段目
##GA_Combo1
【Blueprint（任意）】フォルダを作って、【GameplayAbility（任意）】フォルダを作り、
そのフォルダの中で、右クリックから、【ブループリントクラス】を選択
![qiita_gas_116.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/84f00fb7-3797-7662-05cd-dc973e3986cc.jpeg)

Comboで検索して、【Combo_GameplayAbility】を選んで選択をクリック。
![qiita_gas_117.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/ef5cf861-86e3-ddd9-514b-78e62c598a32.jpeg)

ファイル名を【GA_Combo1（任意）】にします。
![qiita_gas_118.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/395bbb0e-288f-abf9-e888-2f07823583bd.jpeg)

ダブルクリックで開いて、【クラスのデフォルト】を選択した状態で、詳細欄にタグを追加します。
![qiita_gas_125.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/01098730-965d-5071-3678-f0692899c4dc.jpeg)

- タグ追加
    - 【Ability Tags】 ```Ability.Actioon.Attack```
    - 【Activation Owned Tags】 ```Ability.State.Combo1```
    - 【Activation Blocked Tags】 ```Ability.State```

タグの追加が済んだら、イベントグラフ内に、以下のノードを組みます。
[![qiita_gas_154.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/68f4fe28-7065-7ce4-4f3f-c0d78b0c16dc.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**<br>![qiita_207.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/6544c2cf-8ff9-a9c7-475e-c78c46f52341.jpeg)](https://blueprintue.com/blueprint/ij4lf9e7/)




【Ctrl + a】【Ctrl + c】でコピーして、イベントグラフに戻って【Ctrl + v】でペーストします。

##BP_PaperCharacter設定
BP_PaperCharacterを開き、【クラスのデフォルト】を選択した状態で、【GA_Combo1】を追加
![qiita_gas_126.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/baa642d6-321c-e6a9-e498-9932498de898.jpeg)

次に、変数を4つ追加　```bAttack AnimSet AttackCombo Damage```
![qiita_gas_130.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/44e935f2-91e1-f21f-5d3a-bbe2aae0eaec.jpeg)


次に、【Z】を押したら、コンボ攻撃をするように、以下のようにノードを組みます。
![qiita_gas_127.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/3c542202-877c-8c37-593e-38d322d1fbfb.jpeg)

イベントグラフを少し整理します。【Handle Animation】と【Handle movement】の部分を修正します。
【Tick - Updates animation】の項目は、【Handle movement】の中に内包しました。
[![qiita_gas_128.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/6496fa5d-01e8-4e40-63c2-11f88469a5e9.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**](https://blueprintue.com/blueprint/4zrfdam1/)

【Option 2】にコンボ1用のフリップブックを指定します。
![qiita_gas_129.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/d697fca1-8be9-bd3a-4a9d-8d96e9c01c87.jpeg)

- フリップブックの作成方法に関しては、以下にまとめてあります。
    - [**UE4で2Dドット絵ゲームを作る際のTipsまとめ。 - Qiita**](https://qiita.com/O_Y_G/items/cc1b4920a2b4a6bfd921#2-%E3%82%AD%E3%83%A3%E3%83%A9%E3%82%AF%E3%82%BF%E3%83%BC%E7%94%BB%E5%83%8F)
    - [**[UE4]2Dアクションゲームを作ろう #1 ドット絵キャラクター編 -YouTube**](https://youtu.be/fo3xTxEyq-w)

手元に、コンボ用の画像がない場合は、GitHubに完成データと、サンプル画像を置いておくので、
そちらから、画像をダウンロードしてみてください。
**https://github.com/O-Y-G/GAS_Sprite**

###BPI_Player_Combo
画面左側の【インターフェース】の【BPI_Player_Combo】をダブルクリック。
![qiita_gas_131.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/ff35efef-9e95-0d34-5dac-7ce133c42985.jpeg)

以下のようにノードを組みます。
[![qiita_gas_132.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/46300b83-6fd1-fd70-e565-6964f10b4a96.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**](https://blueprintue.com/blueprint/oo0bgn5j/)

###BPI_Player_Combo_End
BPI_Player_Combo_Endを以下のようにします。
[![qiita_gas_133.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/64d4ebf0-e0be-5062-b0de-187cee15ebb7.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**](https://blueprintue.com/blueprint/bza2t4hm/)

##コンボ1段目完成

![GAS_Sprite_01.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/23b204d2-3b55-0104-2a10-44f72f9c23cf.gif)


#8. コンボ2段目
##GA_Combo2
【GA_Combo2】を作成。
![qiita_gas_134.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/c6fc3d3c-ef7a-25c9-c38a-e18c4e7f12f8.jpeg)

【クラスのデフォルト】を選択状態で、タグ編集
![qiita_gas_135.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/82364a51-c310-3fcf-c754-c70000c5b0c1.jpeg)

- タグ追加
    - 【Ability Tags】 ```Ability.Actioon.Attack```
    - 【Activation Owned Tags】 ```Ability.State.Combo2```
    - 【Activation Required Tags】 ```Ability.Ready.Combo2```
    - 【Activation Blocked Tags】 ```Ability.State.Combo2```

タグの追加が済んだら、イベントグラフ内に、以下のノードを組みます。
[![qiita_gas_155.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/78b5b233-e8a1-daf7-b245-0c0060d397c2.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**](https://blueprintue.com/blueprint/_48b3b1k/)




##BP_PaperCharacter
BP_PaperCharacterを開き、【クラスのデフォルト】を選択した状態で、【GA_Combo2】を追加
![qiita_gas_142.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/9412df12-ab48-b98a-58e8-b0d12c7c46a1.jpeg)

キャラクターのOption3に2段目のフリップブックを指定します。
![qiita_gas_137.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/d2f8f4c1-c5cb-0e6d-7f2b-882ccd97c37a.jpeg)

##コンボ2段目完成
![GAS_Sprite_02.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/24fb3796-5814-5fe5-690b-5c4ff8c386ee.gif)




#9. コンボ3段目
##GA_Combo3
【GA_Combo3】を作成
![qiita_gas_138.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/ddb5f368-88f3-5200-bbd6-0ea131fb31e5.jpeg)

【クラスのデフォルト】を選択状態で、タグ編集
![qiita_gas_139.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/6f5eb2c9-322b-a5e8-352d-fc7a67cd9e71.jpeg)

- タグ追加
    - 【Ability Tags】 ```Ability.Actioon.Attack```
    - 【Activation Owned Tags】 ```Ability.State.Combo3```
    - 【Activation Required Tags】 ```Ability.Ready.Combo3```
    - 【Activation Blocked Tags】 ```Ability.State.Combo3```

タグの追加が済んだら、イベントグラフ内に、以下のノードを組みます。
[![qiita_gas_156.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/68994d98-8e48-3489-096c-e20488e96a0d.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**](https://blueprintue.com/blueprint/cg4uhygx/)

##BP_PaperCharacter
BP_PaperCharacterを開き、【クラスのデフォルト】を選択した状態で、【GA_Combo3】を追加
![qiita_gas_141.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/86f39db4-a0aa-1446-812c-3b697d77dfd1.jpeg)

キャラクターのOption3に2段目のフリップブックを指定します。
![qiita_gas_143.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/627b3823-c165-ab9a-86b2-7008151eb003.jpeg)

##コンボ3段目完成

![GAS_Sprite_03.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/47e9fe81-9421-90f8-96e0-3d1126298a31.gif)


#10.ダメージボックスの指定
##BP_PaperCharacter
###DamageBox
【コンポーネントを追加】から、【Box Collition】を選択し、名前を【DamageBox】に
![qiita_gas_144.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/ab346720-155d-aa99-249d-bc0e172296b0.jpeg)

画像のように設定し、一時的に、プレイ中にボックスコリジョンを見れるようにします。


###BPI_Player_Combo_Damage
以下のようにノードを組みます。
[![qiita_gas_149.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/6a93f3b4-c9e3-859d-e3dc-a43785742fad.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**](https://blueprintue.com/blueprint/jz5we9xc/)

###BPI_Player_Combo_Damage_End
以下のようにノードを組みます。
[![qiita_gas_147.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/c35c56df-8775-a0ca-0cd0-963dc03e6dee.jpeg)<br>**【※画像をクリックするとノードがコピペ出来るサイトに飛びます。】**](https://blueprintue.com/blueprint/tmplv1rb/)

###DamageBox オーバーラップイベント
イベントグラフに
（例えば）以下のように組んでみます。この工程は、今回は必要ありません。
![qiita_gas_148.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/1eb3d0d0-48ea-cc42-cc98-24e5bb6f6208.jpeg)

##ダメージボックス指定完了
![GAS_Sprite_04.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/906226/dd472292-202a-b278-04fa-8fea2b1f550f.gif)

以上で、GASを使っての、PaperCharacterでコンボ攻撃実装になります。

#ソースコード
GitHubに完成データを置いておきます。
作業に詰まった場合などに確認してみてください。
**https://github.com/O-Y-G/GAS_Sprite**

#おわりに
あまり簡単な実装方法、という感じにならなかったのですが、
Gameplay Ability System に慣れる工程で確認してみてもらえればなと思います。

GASを使わないコンボ実装も、このあと記事にしようと思いますが、
諸々考慮すると、GASで組んだ方が良いような気がします。
GASに慣れておいた方が良いと思うのと、オンライン化しやすい仕組みで組んでいった方が後々助かると思います。

- 今回のコンボ用の画像の生成には、UE4マーケットプレイスから2つのコンテンツをお借りしました。
    - [**Frank Fighting Set 2：アニメーション - UE マーケットプレイス**](https://www.unrealengine.com/marketplace/ja/product/frank-fighting-set)
    - [**3D to Pixel：ブループリント - UE マーケットプレイス**](https://www.unrealengine.com/marketplace/ja/product/3d-to-pixels)

おかげさまで、いろいろな手間が省けました。ありがとうございます。

Gameplay Ability Systemは、こちらの記事が無ければ、触ることもできなかったので、
[**「おかわりのアンリアルなメモ」 - おかわりはくまい様**](https://okawari-hakumai.hatenablog.com/)
[**「株式会社ヒストリア｜ゲームやデジタルコンテンツの企画・開発」 - 株式会社ヒストリア様**](https://historia.co.jp/)
この2サイト様には、重ね重ね感謝いたします。

GASの情報をもっと知りたい人は、こちらを確認してみてもらえればと思います。
[**【UE4 BPプロジェクトに Gameplay Ability System を導入する方法 -参考資料まとめ- Qiita】**](https://qiita.com/O_Y_G/items/700e03f3b60564af4161#%E5%8F%82%E8%80%83%E8%B3%87%E6%96%99%E3%81%BE%E3%81%A8%E3%82%81)

GASユーザーが増えて、情報が少しでも増えることを期待してます。

[**前記事≫UE4 Gameplay Ability System で2Dコンボ攻撃（1/2）導入編 に戻る**](https://qiita.com/O_Y_G/items/30c2d5618a3bdfbd649d)