前言
UE4的细节面板(DetailViews)指的是展示UObject对象属性的面板,如下所示:
UE4提供了一套针对UObject的细节面板生成机制,能将一个UObject的各种属性轻松的生成对应的细节面板
UObject对象细节面板(DetailsView)
UObject细节面板(DetailsView)的构成
上面是StaticMeshComponent的细节面板,其自身就是SDetailsView, 为SCompountWidget组件。
SDetailsView自身是由UObject的属性生成,类别名其实就是UObject的UPEROPRTY(Category = "xxx").
而根据UObject的变量类别的不同,最终生成的控件就不同。
具体可以在PropertyEditorHelpers.cpp看到所有的UObject属性反射生成的SWidget类型
UObject细节面板(IDetailsView)的创建
用IDetailsView来创建细节面板,IDetailsView本身也是SCompoundWidget
TSharedPtr<IDetailsView> DetailsView;
FPropertyEditorModule& PropertyEditorModule = FModuleManager::LoadModuleChecked<FPropertyEditorModule>("PropertyEditor");
FDetailsViewArgs DetailsViewArgs(false, false, false, FDetailsViewArgs::HideNameArea);
DetailsView = PropertyEditorModule.CreateDetailView(DetailsViewArgs);
FTestDetailViewEdMode* TestEdMode = GetEditorMode();
if (nullptr != TestEdMode)
{
DetailsView->SetObject(TestEdMode->MyObject);
}
这里的MyObject对象为
UCLASS()
class TESTDETAILVIEW_API UMyObject : public UObject
{
GENERATED_BODY()
public:
UPROPERTY(EditAnywhere, Category = "Test")
float a;
UPROPERTY(EditAnywhere, Category = "Test")
UStaticMesh* Mesh;
UPROPERTY(EditAnywhere, Category = "Test")
int c;
};
细节面板(IDetailsView)的定制
由UObject生成的DetailsView是各种可调节值的控件的组合, 也就是SPropertyEditorXXX类。但有时候,我们为了功能需求想进一步定制DetailsView,比如在XXX类别下加个SButton之类。想要进一步定制DetailsView,得继承IDetailCustomization,并在CustomizeDetails中增加控件。
继承IDetailCustomization
class MyObjectDetailCustom : public IDetailCustomization
{
public:
static TSharedRef<IDetailCustomization> MakeInstance();
virtual void CustomizeDetails(IDetailLayoutBuilder& DetailBuilder) override;
};
CustomizeDetails,EditCategory,AddCustomRow
在void CustomizeDetails(IDetailLayoutBuilder& DetailBuilder)函数中增加需要的控件,IDetailLayoutBuilder接口提供了编辑类别EditCategory可以返回IDetailCategoryBuilder, 而IDetailCategoryBuilder的AddCustomRow可以给类别增加自定义的一行内容
TSharedRef<IDetailCustomization> MyObjectDetailCustom::MakeInstance()
{
return MakeShareable(new MyObjectDetailCustom);
}
void MyObjectDetailCustom::CustomizeDetails(IDetailLayoutBuilder& DetailBuilder)
{
IDetailCategoryBuilder& aaa = DetailBuilder.EditCategory(FName("aaa"));
aaa.AddCustomRow(FText::GetEmpty())
.NameContent()
[
SNew(STextBlock)
.Text(FText::FromString("sss"))
]
.ValueContent()
[
SNew(SButton)
.Text(FText::FromString("abc"))
];
}
当然要让CustomizeDetails起效果,还得在开始模块进行CustomizeDetails的注册
FPropertyEditorModule& PropertyEditorModule = FModuleManager::LoadModuleChecked<FPropertyEditorModule>("PropertyEditor");
PropertyEditorModule.RegisterCustomClassLayout(FName("MyObject"), FOnGetDetailCustomizationInstance::CreateStatic(&MyObjectDetailCustom::MakeInstance));
退出模块记得注销CustomizeDetails
FPropertyEditorModule& PropertyEditorModule = FModuleManager::LoadModuleChecked<FPropertyEditorModule>("PropertyEditor");
PropertyEditorModule.UnregisterCustomClassLayout(FName("MyObject"));
效果如下:
其实CustomizeDetails是SDetailsView的SetObject调用的。
细节面板(DetailsView)的刷新
SDetailsView的接口SetObject不仅仅用于生成UObject对应的细节面板,当SetObject(XXXUObject, true)指定true的时候可以重新刷新界面
细节面板(DetailsView)控制UObject的某些属性是否显示
有时候细节面板存在太多的属性,导致界面过于复杂,我们希望某些属性在某些情况下不显示或者显示,SDetailsView提供了
void SDetailsViewBase::SetIsPropertyVisibleDelegate(FIsPropertyVisible InIsPropertyVisible) 接口
/** Delegate called to see if a property should be visible */
DECLARE_DELEGATE_RetVal_OneParam( bool, FIsPropertyVisible, const FPropertyAndParent& );
例子:
UCLASS()
class TESTDETAILVIEW_API UMyObject : public UObject
{
GENERATED_BODY()
public:
UPROPERTY(EditAnywhere, Category = "Test", meta = (TestShow = "111"))
float a;
UPROPERTY(EditAnywhere, Category = "Test")
UStaticMesh* Mesh;
UPROPERTY(EditAnywhere, Category = "Test", meta = (TestShow = "222"))
int c;
};
这里利用属性的Meta数据作为属性显示和不显示的判断依据(实际上编辑器细节面板开发控制属性显示不显示经常用到UProperty的MetaData)
DetailsView->SetIsPropertyVisibleDelegate(FIsPropertyVisible::CreateSP(this, &SMyCompoundWidget::IsPropertyVisible));
bool SMyCompoundWidget::IsPropertyVisible(const FPropertyAndParent& PropertyAndParent)
{
const UProperty& Property = PropertyAndParent.Property;
static const FName MetaName = "TestShow";
if (Property.HasMetaData(MetaName))
{
TArray<FString> MetaStrs;
Property.GetMetaData(MetaName).ParseIntoArray(MetaStrs, TEXT(","), true);
if(MetaStrs.Contains("222"))
return true;
}
return false;
}
显示结果:
定制细节面板(CustomizeDetails)控制类别下添加的行(FDetailWidgetRow)是否显示
可以直接用FDetailWidgetRow的Visibility
aaa.AddCustomRow(FText::GetEmpty())
.Visibility(xxxxxxxx)
.ValueContent()
[
SNew(SButton)
.Text(FText::FromString("abc"))
];
UStruct对象的细节面板
前面说到的是针对UObject对象的细节面板定制, 实际上UStruct对象也是可以定制细节面板。一个非常经典的例子就是FColor(颜色)或者FCurve(曲线),他们在细节面板暴露的UI就比较特别,就是通过UStruct DetailPanel来定制的。
拿下面自定的UStuct为例子:
USTRUCT()
struct FTestData
{
GENERATED_BODY()
public:
UPROPERTY(EditAnywhere, Category = "Asset")
int32 A;
UPROPERTY(EditAnywhere, Category = "Asset")
UStaticMesh* Mesh;
};
UStruct Customization定制类声明和定义
class FTestDataCustomization : public IPropertyTypeCustomization
{
public:
static TSharedRef<IPropertyTypeCustomization> MakeInstance()
{
return MakeShareable(new FTestDataCustomization());
}
/**
* Destructor
*/
virtual ~FTestDataCustomization()
{
}
public:
// IDetailCustomization interface
virtual void CustomizeHeader(TSharedRef<IPropertyHandle> InStructPropertyHandle, FDetailWidgetRow& InHeaderRow, IPropertyTypeCustomizationUtils& InStructCustomizationUtils) override;
virtual void CustomizeChildren(TSharedRef<IPropertyHandle> InStructPropertyHandle, IDetailChildrenBuilder& InChildBuilder, IPropertyTypeCustomizationUtils& InStructCustomizationUtils) override;
private:
TSharedPtr<IPropertyHandle> APropertyHandle;
TSharedPtr<IPropertyHandle> MeshPropertyHandle;
void FTestDataCustomization::CustomizeHeader(TSharedRef<IPropertyHandle> InStructPropertyHandle, FDetailWidgetRow& InHeaderRow, IPropertyTypeCustomizationUtils& InStructCustomizationUtils)
{
// 获取本UStruct对象所在的UObject对象
const TArray<TWeakObjectPtr<UObject>>& SelectedObjects = InStructCustomizationUtils.GetPropertyUtilities()->GetSelectedObjects();
if(SelectedObjects.Num() > 0 && SelectedObjects[0].IsValid())
{
}
// 获取本Struct对象
void* ValuePtr;
InStructPropertyHandle->GetValueData(ValuePtr);
FTestData* Test = reinterpret_cast<FTestData*>(ValuePtr);
if(Test)
{
}
APropertyHandle = InStructPropertyHandle->GetChildHandle(GET_MEMBER_NAME_CHECKED(FTestData, A));
MeshPropertyHandle = InStructPropertyHandle->GetChildHandle(GET_MEMBER_NAME_CHECKED(FTestData, Mesh));
InHeaderRow.WholeRowContent()
.HAlign(HAlign_Center)
[
SNew(SVerticalBox)
+SVerticalBox::Slot()
[
SNew(SHorizontalBox)
+SHorizontalBox::Slot()
[
APropertyHandle->CreatePropertyNameWidget()
]
+SHorizontalBox::Slot()
[
APropertyHandle->CreatePropertyValueWidget()
]
]
+SVerticalBox::Slot()
[
SNew(SHorizontalBox)
+SHorizontalBox::Slot()
[
MeshPropertyHandle->CreatePropertyNameWidget()
]
+SHorizontalBox::Slot()
[
MeshPropertyHandle->CreatePropertyValueWidget()
]
]
+SVerticalBox::Slot()
[
SNew(SButton)
.Text(FText::FromString("Hello World"))
]
];
}
void FTestDataCustomization::CustomizeChildren(TSharedRef<IPropertyHandle> InStructPropertyHandle, IDetailChildrenBuilder& InChildBuilder, IPropertyTypeCustomizationUtils& InStructCustomizationUtils)
{
}
步骤和UObjectDetail极其类似。
UStruct Customization定制类注册(在模块启动)
FPropertyEditorModule& PropertyModule = FModuleManager::LoadModuleChecked<FPropertyEditorModule>("PropertyEditor");
PropertyModule.RegisterCustomPropertyTypeLayout( "TestData", FOnGetPropertyTypeCustomizationInstance::CreateStatic( &FTestDataCustomization::MakeInstance ) );
退出模块记得注销
FPropertyEditorModule& PropertyModule = FModuleManager::LoadModuleChecked<FPropertyEditorModule>("PropertyEditor");
PropertyModule.UnregisterCustomPropertyTypeLayout( "TestData");
UStruct细节面板(IStructureDetailsView)的创建
FTestData TestData;
TSharedPtr<class IStructureDetailsView> StructureDetailsView;
TSharedPtr<FStructOnScope> StructToDisplay = MakeShareable(new FStructOnScope(FTestData::StaticStruct(), (uint8*)&TestData));
FStructureDetailsViewArgs StructureViewArgs;
StructureViewArgs.bShowObjects = true;
StructureViewArgs.bShowAssets = true;
StructureViewArgs.bShowClasses = true;
StructureViewArgs.bShowInterfaces = true;
FDetailsViewArgs ViewArgs;
ViewArgs.bAllowSearch = false;
ViewArgs.bHideSelectionTip = false;
ViewArgs.bShowActorLabel = false;
// Create a property view
FPropertyEditorModule& EditModule = FModuleManager::Get().GetModuleChecked<FPropertyEditorModule>("PropertyEditor");
StructureDetailsView = EditModule.CreateStructureDetailView(ViewArgs, StructureViewArgs, StructToDisplay, LOCTEXT("Struct", "Struct View"));
return SNew(SDockTab)
.TabRole(ETabRole::NomadTab)
[
// Put your tab content here!
SNew(SBox)
.HAlign(HAlign_Center)
.VAlign(VAlign_Center)
[
StructureDetailsView->GetWidget().ToSharedRef()
]
];
参考资料
[1]. UE4的地形编辑器源码 Engine\Source\Editor\LandscapeEditor文件夹下的SLandscapeEditor.cpp,SLandscapeEditor.h, LandscapeEditorObject.h
[2].https://docs.unrealengine.com/zh-CN/Programming/Slate/DetailsCustomization/index.html
[3] FBlackboardSelectorDetails
[4] SKismetInspector.h