大家好，又见面了，我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全系列IDE稳定放心使用
原创文章，转载请注明出处。
点击观看上一篇《UE4 Slate三 SlateUI代码讲解》
点击观看下一篇《UE4 Slate五 SlateUI如何自定义样式(Custom Style)》
虚幻引擎 SlateUI介绍
1>前言
我们都知道在UMG里面如何创建一个UMG的动画，其实就是时间帧动画。那么在Slate纯手写的代码上如何做动画呢？
2>SlateAnimation代码
先看看做出来的效果
我们将会用到Engine里面的FCurveSequence，对我们新建的Slate做一个透明度渐变的动画。
对此我新建了一个Slate的类
2.1>头文件
//外部Slot里面的都是作为这个Slate里面的ChildSlot出现
SLATE_DEFAULT_SLOT(FArguments, OutSlots)
//Slate动画演示类
class SMyAnimationSlate : public SCompoundWidget /*public SUserWidget*/
{
public:
//SLATE_BEGIN_ARGS+SLATE_END_ARGS 其实是一个结构体, 内部写的东西都相当于写在了一个结构体里面
SLATE_BEGIN_ARGS(SMyAnimationSlate)
{
_Visibility = EVisibility::SelfHitTestInvisible;
}
//外部Slot里面的都是作为这个Slate里面的ChildSlot出现
SLATE_DEFAULT_SLOT(FArguments, OutSlots)
SLATE_END_ARGS()
//外部执行SNew或者SAssignNew时候会调用Construct()
void Construct(const FArguments& InArgs);
//鼠标进入
virtual void OnMouseEnter(const FGeometry& MyGeometry, const FPointerEvent& MouseEvent) override;
//鼠标离开
virtual void OnMouseLeave(const FPointerEvent& MouseEvent) override;
//颜色变化
FLinearColor SlateColorChanged();
private:
//Slate动画对象
FCurveSequence MySlateCurveSequence;
};
2.2 CPP实现
void SMyAnimationSlate::Construct(const FArguments& InArgs)
{
MySlateCurveSequence = FCurveSequence(0.f, 1.f);
ColorAndOpacity = TAttribute<FLinearColor>::Create(TAttribute<FLinearColor>::FGetter::CreateSP(this, &SMyAnimationSlate::SlateColorChanged));
ChildSlot
[
InArgs._OutSlots.Widget
];
}
void SMyAnimationSlate::OnMouseEnter(const FGeometry& MyGeometry, const FPointerEvent& MouseEvent)
{
if (!MySlateCurveSequence.IsAtEnd())
{
if (MySlateCurveSequence.IsInReverse() && MySlateCurveSequence.IsPlaying())
{
MySlateCurveSequence.Reverse();
}
else if (!MySlateCurveSequence.IsPlaying())
{
MySlateCurveSequence.Play(this->AsShared());
}
}
}
void SMyAnimationSlate::OnMouseLeave(const FPointerEvent& MouseEvent)
{
if (!MySlateCurveSequence.IsAtStart())
{
if (!MySlateCurveSequence.IsInReverse() && MySlateCurveSequence.IsPlaying())
{
MySlateCurveSequence.Reverse();
}
else if (!MySlateCurveSequence.IsPlaying())
{
MySlateCurveSequence.PlayReverse(this->AsShared());
}
}
}
FLinearColor SMyAnimationSlate::SlateColorChanged()
{
return FLinearColor(1, 1, 1, 1 - MySlateCurveSequence.GetLerp());
}
2.3 代码分析
2.3.1 SLATE_DEFAULT_SLOT宏介绍
SLATE_DEFAULT_SLOT这个宏是为了获取到外部的Slot，
比如外部
SNew(SMyAnimationSlate)
[
括号里面写的所有Slate都会作为一个整体传进来，我们就是想在外部SNew这个类，下面所有子节点都能应用我们的渐变动画。
]
//外部Slot里面的都是作为这个Slate里面的ChildSlot出现
SLATE_DEFAULT_SLOT(FArguments, OutSlots)
2.3.2 构造中对上面的宏定义的变量进行赋值
然后去Cpp构造里面实现一下, 没有为什么，按照下面写就是了。
void SMyAnimationSlate::Construct(const FArguments& InArgs)
{
ChildSlot
[
InArgs._OutSlots.Widget
];
}
那么外部是怎么SNew(SMyAnimationSlate) 这个渐变动画对象呢?
2.3.3外部SNew(SMyAnimationSlate)
SNew(SMyAnimationSlate)
[
这个里面的所有SNew的slot就是SLATE_DEFAULT_SLOT(FArguments, OutSlots)这个，目的是不用传值直接给过来。然后我们整体对其做动画。
]
//测试动画的
+ SConstraintCanvas::Slot()
.Anchors(0.f)
.Offset(FMargin(100, 600, 200, 200)) //这个可能会迷惑, 第一个参数在这是PositionX, 第二个参数在这是PositionY, 第三个参数在这是SizeX, 第四个参数在这是SizeY.找不到设置坐标的同学注意看这里
.Alignment(FVector2D(0.f, 0.f)) //同样的, 对应Alignment是个FVector2D
.AutoSize(false) //对应AutoSize
.ZOrder(0)
[
SNew(SMyAnimationSlate)
[
SNew(SButton)
.HAlign(HAlign_Center)
.VAlign(VAlign_Center)
.ContentPadding(0.f)
.OnClicked(this, &SMainSlate::OnFirstSButton_OnClicked) //事件绑定的技巧, 转到定义, 看那边的代理是怎么定义的, 把参数和返回值拿过来定义一个函数即可
.OnPressed(this, &SMainSlate::OnFirstSButton_OnPressed)
.OnReleased(this, &SMainSlate::OnFirstSButton_OnReleased)
.OnHovered(this, &SMainSlate::OnFirstSButton_OnHovered)
.OnUnhovered(this, &SMainSlate::OnFirstSButton_OnUnhovered)
[
SNew(STextBlock)
.Text(LOCTEXT("SMainSlate_ButtonSlateAnimation_Text3333", "测试Slate动画"))
.Font(FCoreStyle::GetDefaultFontStyle("Roboto", 24))
]
]
]
3>下面来看看效果，和文章开始的图一样
鼠标Hover上去之后会进行透明度减小，鼠标离开透明度再变回来
点击观看上一篇《UE4 Slate三 SlateUI代码讲解》
点击观看下一篇《UE4 Slate五 SlateUI如何自定义样式(Custom Style)》
谢谢，创作不易，大侠请留步… 动起可爱的双手，来个赞再走呗 <(￣︶￣)>
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/185981.html原文链接：https://javaforall.net
