ブロックしたプレイヤーメニューとプレイヤーアクションメニューを追加する - フレンドを管理する - (Unreal Engine モジュール)

Last updated on June 12, 2024

What's on the menu​

In this section, you will learn how to prepare widgets that you will use to display blocked players and also action buttons to unfriend, block, and unblock players. The widgets are available in the Resources section and are defined in the following classes:

  • BlockedPlayersWidget_Starter: A C++ you will use to call functionalities to display blocked players.
    • Header file: /Source/AccelByteWars/TutorialModules/Social/ManagingFriends/UI/BlockedPlayersWidget_Starter.h
    • CPP file: /Source/AccelByteWars/TutorialModules/Social/ManagingFriends/UI/BlockedPlayersWidget_Starter.cpp
    • Blueprint widget: /Content/TutorialModules/Social/ManagingFriends/UI/W_BlockedPlayers_Starter.uasset
  • BlockedPlayerWidgetEntry_Starter: A C++ class you will use to display the blocked players' information, such as their display name and avatar.
    • Header file: /Source/AccelByteWars/TutorialModules/Social/ManagingFriends/UI/BlockedPlayerWidgetEntry_Starter.h
    • CPP file: /Source/AccelByteWars/TutorialModules/Social/ManagingFriends/UI/BlockedPlayerWidgetEntry_Starter.cpp
    • Blueprint widget: /Content/TutorialModules/Social/ManagingFriends/UI/W_BlockedPlayerEntry_Starter.uasset

Take a look at more details on how these widgets are constructed.

Blocked Players widget​

The Blocked Players widget have several states representing each state of the request status: empty, loading, error, and not empty (showing the blocked players list). These states are achieved by using a custom Widget Switcher: UAccelByteWarsWidgetSwitcher. The list itself is done by using a List View that takes an entry widget class and generates the entry dynamically. Below is a preview of the W_BlockedPlayers_Starter Blueprint widget:

Blocked players widget Unreal Byte Wars manage friends

The list to show the blocked players is defined in the BlockedPlayersWidget_Starter class Header file.

protected:
    UPROPERTY(BlueprintReadOnly, meta = (BindWidgetOptional, BlueprintProtected = true, AllowPrivateAccess = true))
    UAccelByteWarsWidgetSwitcher* Ws_BlockedPlayers;

    UPROPERTY(BlueprintReadOnly, meta = (BindWidgetOptional, BlueprintProtected = true, AllowPrivateAccess = true))
    UListView* Lv_BlockedPlayers;

Changing the state of this widget is done by calling Ws_BlockedPlayers->SetWidgetState(). Here's an example on how to change the state to a loading state:

Ws_BlockedPlayers->SetWidgetState(EAccelByteWarsWidgetSwitcherState::Loading);

Blocked Player Entry widget​

Below is the preview of the W_BlockedPlayerEntry_Starter Blueprint widget. This widget displays blocked player information, such as display name, avatar, and the unblock button.

Blocked player entry widget Unreal Byte Wars manage friends

The functionality to show a blocked player information is already prepared for you in the BlockedPlayerWidgetEntry_Starter class CPP file, particularly in the function below.

void UBlockedPlayerWidgetEntry_Starter::NativeOnListItemObjectSet(UObject* ListItemObject)
{
    Super::NativeOnListItemObjectSet(ListItemObject);

    CachedBlockedPlayerData = Cast<UFriendData>(ListItemObject);

    // Display display name.
    if (!CachedBlockedPlayerData->DisplayName.IsEmpty())
    {
        Tb_DisplayName->SetText(FText::FromString(CachedBlockedPlayerData->DisplayName));
    }
    else
    {
        Tb_DisplayName->SetText(LOCTEXT("Byte Wars Player", "Byte Wars Player"));
    }

    // Store default brush to be used to reset the avatar brush if needed.
    if (!DefaultAvatarBrush.GetResourceObject())
    {
        DefaultAvatarBrush = Img_Avatar->Brush;
    }

    // Display avatar image.
    const FString AvatarURL = CachedBlockedPlayerData->AvatarURL;
    const FString AvatarId = FBase64::Encode(AvatarURL);

    // Try to set avatar image from cache.
    FCacheBrush CacheAvatarBrush = AccelByteWarsUtility::GetImageFromCache(AvatarId);
    if (CacheAvatarBrush.IsValid())
    {
        Img_Avatar->SetBrush(*CacheAvatarBrush.Get());
    }
    // Set avatar image from URL if it is not exists in cache.
    else if (!AvatarURL.IsEmpty())
    {
        AccelByteWarsUtility::GetImageFromURL(
            AvatarURL,
            AvatarId,
            FOnImageReceived::CreateWeakLambda(this, [this](const FCacheBrush ImageResult)
            {
                Img_Avatar->SetBrush(*ImageResult.Get());
            })
        );
    }
    // If no valid avatar, reset it to the default one.
    else
    {
        Img_Avatar->SetBrush(DefaultAvatarBrush);
    }
}

Below are the declarations of the components used by this widget. The declarations can be found in the BlockedPlayerWidgetEntry_Starter class Header file.

protected:
    UPROPERTY(BlueprintReadOnly, meta = (BindWidgetOptional, BlueprintProtected = true, AllowPrivateAccess = true))
    UImage* Img_Avatar;

    UPROPERTY(BlueprintReadOnly, meta = (BindWidgetOptional, BlueprintProtected = true, AllowPrivateAccess = true))
    UTextBlock* Tb_DisplayName;

    UPROPERTY(BlueprintReadOnly, meta = (BindWidgetOptional, BlueprintProtected = true, AllowPrivateAccess = true))
    UCommonButtonBase* Btn_Unblock;

Player Action menu​

The Friend list module covered the Friend Details widget. In addition to displaying friend details, this widget also acts as a player action menu that will show block and unfriend buttons. These buttons are generated dynamically during runtime.

Unfriend button and unblock button Unreal Byte Wars manage friends

When these buttons are clicked, they will trigger the corresponding functions below. You can find these functions in the /Source/AccelByteWars/TutorialModules/Social/ManagingFriends/ManagingFriendsSubsystem_Starter.cpp file. More about this file will be covered later.

void UManagingFriendsSubsystem_Starter::OnUnfriendButtonClicked(const APlayerController* PC, const FUniqueNetIdRepl FriendUserId, const FOnUnfriendComplete& OnComplete)
{
    // TODO: Call unfriend request here.
}

void UManagingFriendsSubsystem_Starter::OnBlockButtonClicked(const APlayerController* PC, const FUniqueNetIdRepl BlockedPlayerUserId, const FOnBlockPlayerComplete& OnComplete)
{
    // TODO: Call block player request here.
}

Ready the UI​

In this section, you will learn how to prepare the widgets so you can follow along with the tutorial.

  1. Open the BlockedPlayerWidgetEntry_Starter class CPP file and you'll find the function below. This function will be triggered when the unblock button is clicked. Later, you will call the functionality to unblock a player in this function. For now, add the following log as the placeholder:

    void UBlockedPlayerWidgetEntry_Starter::OnUnblockButtonClicked()
    {
        // TODO: Call unblock player request here.
        UE_LOG_MANAGING_FRIENDS(Warning, TEXT("Unblock player is not yet implemented."));
    }

  2. Open the BlockedPlayersWidget_Starter class CPP file. There, you will find the function below. Later, you will call functionalities to get and display the blocked player list in this function. For now, add the following log as the placeholder:

    void UBlockedPlayersWidget_Starter::GetBlockedPlayerList()
    {
        // TODO: Get and display the blocked player list here.
        UE_LOG_MANAGING_FRIENDS(Warning, TEXT("Get blocked player list is not yet implemented."));
    }

  3. Open the /Source/AccelByteWars/TutorialModules/Social/ManagingFriends/ManagingFriendsSubsystem_Starter.cpp file and add the log below. Later, you will call functionalities to unfriend and block players.

    void UManagingFriendsSubsystem_Starter::OnUnfriendButtonClicked(const APlayerController* PC, const FUniqueNetIdRepl FriendUserId, const FOnUnfriendComplete& OnComplete)
    {
        // TODO: Call unfriend request here.
        UE_LOG_MANAGING_FRIENDS(Warning, TEXT("Unfriend is not yet implemented."));
    }

    void UManagingFriendsSubsystem_Starter::OnBlockButtonClicked(const APlayerController* PC, const FUniqueNetIdRepl BlockedPlayerUserId, const FOnBlockPlayerComplete& OnComplete)
    {
        // TODO: Call block player request here.
        UE_LOG_MANAGING_FRIENDS(Warning, TEXT("Block player is not yet implemented."));
    }

  4. Build your project and open it in the Unreal Engine Editor. In the Unreal Engine Editor, go to /Content/TutorialModules/Social/ManagingFriends/. There, you will find a data asset called DA_ManagingFriends. Open it and enable the Is Starter Mode Active. Then, save the data asset. This will activate the widgets so you can navigate through them when you play the game.

    Activate Tutorial Module Data Asset starter mode Unreal Byte Wars manage friends

  5. Play the game in the Editor, log in, and test navigating to the following locations:

    • Social > Blocked Players. If implemented correctly, you will see text saying No entry to show along with this log:

      LogFriendsEssentials: Warning: Get blocked player list is not yet implemented.

    • Social > Friends, click a player on the list, and click Block Player. If implemented correctly, you will see this log:

      LogFriendsEssentials: Warning: Block player is not yet implemented.

    • Social > Friends, click a player on the list, and click Unfriend. If implemented correctly, you will see this log:

      LogFriendsEssentials: Warning: Unfriend is not yet implemented.

Resources​

に最終更新

On this page