• 【UE】富文本块(RichTextBlock) 增加超链接支持

    首

    RichTextBlock使用方式参考官方文档：RichTextBlockUE
    文档中描述了不同样式文字以及图片的使用，但没有具体说明超链接的实现，但库中有hyperlink结构。
    因此照猫画虎实现，仿照RichImgDecorator实现。

    体

    • 首先在build.cs 里增加Slate引用
    		PrivateDependencyModuleNames.AddRange(
			new string[]
			{ 
				"UMG",
				"Slate",
				"SlateCore",
			});

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 编写SRichTextHyperlink_Ex.h文件 基于SRichTextHyperlink的拓展，增加点击回调href连接地址。
    // Copyright Epic Games, Inc. All Rights Reserved.
#pragma once

#include "CoreMinimal.h"
#include "SlateGlobals.h"
#include "Input/Reply.h"
#include "Layout/Margin.h"
#include "Styling/SlateTypes.h"
#include "Framework/Text/SlateHyperlinkRun.h"
#include "Widgets/DeclarativeSyntaxSupport.h"
#include "Styling/CoreStyle.h"
#include "Widgets/Input/SHyperlink.h"

class FWidgetViewModel;
enum class ETextShapingMethod : uint8;
DECLARE_DELEGATE_TwoParams(FHyperlinkDelegate,FString ,FString);
#if WITH_FANCY_TEXT

class SRichTextHyperlink_Ex : public SHyperlink
{
public:

	SLATE_BEGIN_ARGS(SRichTextHyperlink_Ex)
	: _Text()
	, _Href()
	, _Type()
	, _Style(&FCoreStyle::Get().GetWidgetStyle< FHyperlinkStyle >("Hyperlink"))
	, _TextStyle(nullptr)
	, _UnderlineStyle(nullptr)
	, _Delegate()
	, _Padding()
	, _OnNavigate()
	, _TextShapingMethod()
	, _TextFlowDirection()
	{}

	SLATE_ATTRIBUTE( FText, Text )
	SLATE_ARGUMENT( FString , Href )
	SLATE_ARGUMENT( FString , Type )
	SLATE_STYLE_ARGUMENT( FHyperlinkStyle, Style )
	SLATE_STYLE_ARGUMENT( FTextBlockStyle, TextStyle )
	SLATE_STYLE_ARGUMENT( FButtonStyle, UnderlineStyle )
	SLATE_ATTRIBUTE( FMargin, Padding )
	SLATE_EVENT( FSimpleDelegate, OnNavigate )
	SLATE_EVENT( FHyperlinkDelegate, Delegate )
	SLATE_ARGUMENT( TOptional<ETextShapingMethod>, TextShapingMethod )
	SLATE_ARGUMENT( TOptional<ETextFlowDirection>, TextFlowDirection )
	SLATE_END_ARGS()

public:

	void Construct( const FArguments& InArgs, const TSharedRef< FSlateHyperlinkRun::FWidgetViewModel >& InViewModel );
	

	FReply OnClicked () const;
	
	


	virtual void OnMouseEnter( const FGeometry& MyGeometry, const FPointerEvent& MouseEvent ) override
	{
		SHyperlink::OnMouseEnter( MyGeometry, MouseEvent );
		ViewModel->SetIsHovered( true );
	}

	virtual void OnMouseLeave( const FPointerEvent& MouseEvent ) override
	{
		SHyperlink::OnMouseLeave( MouseEvent );
		ViewModel->SetIsHovered( false );
	}

	virtual FReply OnMouseButtonDown( const FGeometry& MyGeometry, const FPointerEvent& MouseEvent ) override
	{
		FReply Reply = SHyperlink::OnMouseButtonDown( MyGeometry, MouseEvent );
		ViewModel->SetIsPressed( bIsPressed );

		return Reply;
	}

	virtual FReply OnMouseButtonUp( const FGeometry& MyGeometry, const FPointerEvent& MouseEvent ) override
	{
		FReply Reply = SHyperlink::OnMouseButtonUp( MyGeometry, MouseEvent );
		ViewModel->SetIsPressed( bIsPressed );

		return Reply;
	}

	virtual bool IsHovered() const override
	{
		return ViewModel->IsHovered();
	}

	virtual bool IsPressed() const override
	{
		return ViewModel->IsPressed();
	}


private:
	FHyperlinkDelegate HyperDelegate;
	FString Href ;
	FString Type ;
	TSharedPtr< FSlateHyperlinkRun::FWidgetViewModel > ViewModel;
};


#endif //WITH_FANCY_TEXT


    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • UHyperlinkRichTextBlockDecorator.h
    // Fill out your copyright notice in the Description page of Project Settings.

#pragma once

#include "CoreMinimal.h"
#include "RichTextBlockDecorator.h"
#include "SRichTextHyperlink_Ex.h"
#include "HyperlinkRichTextBlockDecorator.generated.h"



USTRUCT(Blueprintable, BlueprintType)
struct CLOUDGAME_API FRichHyperlinkRow : public FTableRowBase
{
	GENERATED_USTRUCT_BODY()

public:
	UPROPERTY(EditAnywhere, Category = Appearance)
	FHyperlinkStyle HlStyle;
};


/**
 * 
 */
UCLASS(Abstract, Blueprintable)
class CLOUDGAME_API UHyperlinkRichTextBlockDecorator : public URichTextBlockDecorator
{
	GENERATED_BODY()
public:
	UHyperlinkRichTextBlockDecorator(const FObjectInitializer& ObjectInitializer);
	
	virtual TSharedPtr<ITextDecorator> CreateDecorator(URichTextBlock* InOwner) override;
	
	virtual const FHyperlinkStyle* FindHyperlinkStyle(FName TagOrId, bool bWarnIfMissing);
	
	void OnClickHyperlink(FString Type,FString Href);
protected:
	FRichHyperlinkRow* FindHyperlinkRow(FName TagOrId, bool bWarningIfMissing);
	
	UPROPERTY(EditAnywhere, Category = Appearance, meta = (RequiredAssetDataTags = "RowStructure=RichHyperlinkRow"))
	class UDataTable* HyperlinkSet;
	
};


    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • FHyperlinkRichTextDecorator.h
    #pragma once

#include "CoreMinimal.h"
#include "HyperlinkRichTextBlockDecorator.h"

/**
 * 
 */
class CLOUDGAME_API FHyperlinkRichTextDecorator : public FRichTextDecorator
{
public:
	FHyperlinkRichTextDecorator(URichTextBlock* InOwner, UHyperlinkRichTextBlockDecorator* InDecorator);
	virtual bool Supports(const FTextRunParseResults& RunParseResult, const FString& Text) const override;
protected:
	virtual TSharedPtr<SWidget> CreateDecoratorWidget(const FTextRunInfo& RunInfo, const FTextBlockStyle& TextStyle) const override;
private:
	UHyperlinkRichTextBlockDecorator* Decorator;
	FHyperlinkDelegate HlDelegate;
	FString ParseName = FString("a");

};

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • SRichTextHyperlink_Ex.cpp
    #include "UMG/Hyperlink/SRichTextHyperlink_Ex.h"






void SRichTextHyperlink_Ex::Construct(const FArguments& InArgs, const TSharedRef<FSlateHyperlinkRun::FWidgetViewModel>& InViewModel)
{
	ViewModel = InViewModel;
	this->HyperDelegate = InArgs._Delegate;
	this->Href = InArgs._Href;
	this->Type = InArgs._Type;
	check (InArgs._Style);
	const FButtonStyle* UnderlineStyle = InArgs._UnderlineStyle != nullptr ? InArgs._UnderlineStyle : &InArgs._Style->UnderlineStyle;
	const FTextBlockStyle* TextStyle = InArgs._TextStyle != nullptr ? InArgs._TextStyle : &InArgs._Style->TextStyle;
	TAttribute<FMargin> Padding = InArgs._Padding.IsSet() ? InArgs._Padding : InArgs._Style->Padding;

	SButton::Construct(
		SButton::FArguments()
		.Text( InArgs._Text )
		.ContentPadding( Padding )
		.ButtonStyle( UnderlineStyle )
		.TextStyle( TextStyle )
		.OnClicked(FOnClicked::CreateRaw(this,&SRichTextHyperlink_Ex::OnClicked))
		.ForegroundColor(FSlateColor::UseForeground())
		.TextShapingMethod( InArgs._TextShapingMethod )
		.TextFlowDirection( InArgs._TextFlowDirection )
	);
}

FReply SRichTextHyperlink_Ex::OnClicked() const
{
	HyperDelegate.ExecuteIfBound(Type, Href);
	return FReply::Handled();
}



    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • HyperlinkRichTextBlockDecorator.cpp
    // Fill out your copyright notice in the Description page of Project Settings.


#include "Hyperlink/HyperlinkRichTextBlockDecorator.h"

#include "GEventSubsystem.h"
#include "Hyperlink/HyperlinkRichTextDecorator.h"

UHyperlinkRichTextBlockDecorator::UHyperlinkRichTextBlockDecorator(const FObjectInitializer& ObjectInitializer): Super(ObjectInitializer)
{
}

TSharedPtr<ITextDecorator> UHyperlinkRichTextBlockDecorator::CreateDecorator(URichTextBlock* InOwner)
{
	return MakeShareable(new FHyperlinkRichTextDecorator(InOwner, this));
}

const FHyperlinkStyle* UHyperlinkRichTextBlockDecorator::FindHyperlinkStyle(FName TagOrId, bool bWarnIfMissing)
{
	const FRichHyperlinkRow* HlRow = FindHyperlinkRow(TagOrId, bWarnIfMissing);
	if (HlRow)
	{
		return &HlRow->HlStyle;
	}
	
	return nullptr;
}

void UHyperlinkRichTextBlockDecorator::OnClickHyperlink( FString Type,FString Href)
{
	UE_LOG(LogTemp,Display,TEXT("OnClickHyperlink type =  %s  ; href = %s"),*Type,*Href)
	
}

FRichHyperlinkRow* UHyperlinkRichTextBlockDecorator::FindHyperlinkRow(FName TagOrId, bool bWarningIfMissing)
{
	if (HyperlinkSet)
	{
		FString ContextString;
		return HyperlinkSet->FindRow<FRichHyperlinkRow>(TagOrId, ContextString, bWarningIfMissing);
	}

	return nullptr;
}


    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • HyperlinkRichTextDecorator.cpp
    // Fill out your copyright notice in the Description page of Project Settings.


#include "Hyperlink/HyperlinkRichTextDecorator.h"



FHyperlinkRichTextDecorator::FHyperlinkRichTextDecorator(URichTextBlock* InOwner, UHyperlinkRichTextBlockDecorator* InDecorator)
: FRichTextDecorator(InOwner),Decorator(InDecorator)
{
	HlDelegate.BindUObject(Decorator,&UHyperlinkRichTextBlockDecorator::OnClickHyperlink);
}

bool FHyperlinkRichTextDecorator::Supports(const FTextRunParseResults& RunParseResult, const FString& Text) const
{
	if (RunParseResult.Name == ParseName && RunParseResult.MetaData.Contains(TEXT("id")))
	{
		const FTextRange& IdRange = RunParseResult.MetaData[TEXT("id")];
		const FString TagId = Text.Mid(IdRange.BeginIndex, IdRange.EndIndex - IdRange.BeginIndex);
		const bool bWarnIfMissing = false;
		return Decorator->FindHyperlinkStyle(*TagId, bWarnIfMissing) != nullptr;
	}

	return false;
}

TSharedPtr<SWidget> FHyperlinkRichTextDecorator::CreateDecoratorWidget(const FTextRunInfo& RunInfo,
	const FTextBlockStyle& TextStyle) const
{
	const bool bWarnIfMissing = false;
	const FHyperlinkStyle* HlStyle =  Decorator->FindHyperlinkStyle(*RunInfo.MetaData[TEXT("id")], bWarnIfMissing);
	const FString* Href = RunInfo.MetaData.Find(TEXT("href"));
	const FString* Type = RunInfo.MetaData.Find(TEXT("id"));
	
	const TSharedPtr<FSlateHyperlinkRun::FWidgetViewModel> Model = MakeShareable(new FSlateHyperlinkRun::FWidgetViewModel);
	TSharedPtr<SRichTextHyperlink_Ex> HlWidget = SNew(SRichTextHyperlink_Ex,Model.ToSharedRef())
	.Text(RunInfo.Content)
	.Style(HlStyle)
	.Href(FString(*Href))
	.Type(FString(*Type))
	.Delegate(HlDelegate);

	return HlWidget;
}




    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47

    • 然后项目中引用，使用方式与richimg保持一直，创建蓝图时选择hyperlinkDecorator为父类。数据方式为:

        点击我

    点击ui中的点击我 会打印 onclick的数据 type为name href为 content;

    尾

    参考连接：
    https://docs.unrealengine.com/4.27/en-US/InteractiveExperiences/UMG/UserGuide/UMGRichTextBlock/

    https://forums.unrealengine.com/t/umg-richtextblock-hyperlink-href-markup/454860

  • 相关阅读:
    【OJ每日一练】1000 — A+B Problem
    CSDN编程竞赛-第六期（上）
    DA14531在三星手机手写笔的应用让我打开眼镜
    Linux 基金会分叉 Terraform，正式推出 OpenTofu
    微服务项目：尚融宝（13）（前端平台：搭建管理平台前端程序）
    亚马逊 CodeWhisperer 初体验
    Kubernetes基础服务安装
    虚良SEO怎么有效的对百度蜘蛛权重优化？
    Android Camera2获取摄像头的视场角（FOV）信息
    神经网络理论及应用答案,神经网络理论名词解释
  • 原文地址：https://blog.csdn.net/a940659387/article/details/126389310