Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

FMX 2017: Extending Unreal Engine 4 with Plug-ins (Master Class)

3,179 views

Published on

Overview on creating code projects and plug-ins, and introduction on how to add new asset types to UE4 and customize their look & feel via asset actions and custom asset editors. The corresponding source code is available at https://headcrash.industries/vault/presentations/fmx/

Published in: Software
  • Hello! Get Your Professional Job-Winning Resume Here - Check our website! https://vk.cc/818RFv
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

FMX 2017: Extending Unreal Engine 4 with Plug-ins (Master Class)

  1. 1. FMX 2017 Master Class Extending Unreal Engine 4 with Plug-ins Gerke Max Preussner | Sr. Engine Programmer | Epic Games @gmpreussner | max.preussner@epicgames.com | linkedin.com/in/gmpreussner
  2. 2. What You’re Going To Learn Today UE4 Programming Basics • Structure of UE4 code base Files, Directories, Engine, Projects • Creating a UE4 plug-in Anatomy, Descriptor Files Extending the Engine & Editor • Adding new content asset types We’ll create an asset that stores text • Implementing asset factories New assets via context menu and drag & drop • Editor integration of assets Appearance, actions, custom UI
  3. 3. Prerequisites Required • Unreal Engine 4 www.unrealengine.com/download • Visual Studio 2015 or 2017 Community or Professional Editions Recommended • Refactoring Tools we use Visual Assist X (VAX) • Distributed Build System we use Xoreax IncrediBuild • UnrealVS Extension EngineExtrasUnrealVS
  4. 4. UnrealVS Extension UnrealVS Shortcuts: Tools → Options... → Environment → Keyboard UnrealVS Toolbar
  5. 5. Creating A New Project 1. New Project 2. C++ 3. Basic Code 4. No Starter Content 5. Project Name 1. “Create Project”
  6. 6. Creating A New Project Unreal Editor & Visual Studio
  7. 7. Creating A New Project 1. Change code 2. Press “F7”
  8. 8. Project Structure Folder Structure
  9. 9. Directories • Binaries Compiled game libraries & debug databases • Config Default configuration files • Content Content asset packages • Intermediate Temporary files • Saved Runtime configuration files & log files • Source C++ source code Project Structure Files • {ProjectName}.uproject Project descriptor file • {ProjectName}.sln Visual Studio solution file • {ProjectName}.Target.cs Build target configuration (Game) • {ProjectName}Editor.Target.cs Build target configuration (Editor) • {ProjectName}.Build.cs Build rules & configuration • {ProjectName}.cpp / .h Main project module implementation
  10. 10. Project Structure Directories • Binaries Compiled game libraries & debug databases • Config Default configuration files • Content Content asset packages • Intermediate Temporary files • Saved Runtime configuration files & log files • Source C++ source code Files • {ProjectName}.uproject Project descriptor file • {ProjectName}.sln Visual Studio solution file • {ProjectName}.Target.cs Build target configuration (Game) • {ProjectName}Editor.Target.cs Build target configuration (Editor) • {ProjectName}.Build.cs Build rules & configuration • {ProjectName}.cpp / .h Main project module implementation
  11. 11. Project Structure
  12. 12. Creating A New Plugin 1. Edit → Plugins 2. “New plugin”
  13. 13. Creating A New Plugin
  14. 14. Creating A New Plugin
  15. 15. Plugin Structure
  16. 16. Creating A New Plugin
  17. 17. Plugin Structure Folder Structure
  18. 18. Plugin Structure Directories • Binaries Compiled game libraries & debug databases • Content Content asset packages (optional) • Intermediate Temporary files • Resources Resource files (icons etc.) • Source C++ source code Files • {PluginName}.uplugin Plugin descriptor file • {PluginName}.Build.cs Build rules & configuration • {PluginName}.cpp / .h Main plug-in module implementation
  19. 19. Plugin Structure Directories • Binaries Compiled game libraries & debug databases • Content Content asset packages (optional) • Intermediate Temporary files • Resources Resource files (icons etc.) • Source C++ source code Files • {PluginName}.uplugin Plugin descriptor file • {PluginName}.Build.cs Build rules & configuration • {PluginName}.cpp / .h Main plug-in module implementation
  20. 20. Plugin Structure Plugin Descriptor • Version information • Description • Web links • Options • Module loading rules
  21. 21. Engine Structure Module Types • Development For any application, but used during development only • Editor For use in Unreal Editor only • Runtime For any application at any time • ThirdParty Code and libraries from external third parties • Note: The UE4 EULA prohibits inclusion of Editor modules in shipping games and applications
  22. 22. An Actual Plug-in: TextAsset https://github.com/ue4plugins/TextAsset
  23. 23. An Actual Plug-in: TextAsset
  24. 24. An Actual Plug-in: TextAsset
  25. 25. An Actual Plug-in: TextAsset Plug-in Demonstration
  26. 26. Asset Types Overview Common Tasks • Declare the asset type’s C++ class This is the actual asset • Implement asset factories This is how users create instances of the asset • Customize asset appearance in Editor Thumbnails, colors, detail customizations, filtering, categorization, etc. • Asset-specific Content Browser actions Things you can do when right-clicking an asset • Advanced: Custom asset editor UI For complex asset types
  27. 27. Declaring Asset Types FMX2017/Plugins/TextAsset/Source/TextAsset/Public/TextAsset.h
  28. 28. Declaring Asset Types
  29. 29. Declaring Asset Types
  30. 30. Asset Factories UFactory • Base class for all asset factories • Core logic for Editor integration • Virtual functions to be overridden • Very old API :( Factory Types • Content Browser Context Menu Right-click menu in the Editor Name: {TypeName}FactoryNew • Content Browser Drag & Drop Files on disk dragged into the Editor Name: {TypeName}Factory • Automatic Reimport Recreate assets when files on disk changed Name: Reimport{TypeName}Factory
  31. 31. Asset Factories FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/Factories/TextAssetFactoryNew.h
  32. 32. Asset Factories FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/Factories/TextAssetFactoryNew.cpp
  33. 33. Asset Factories FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/Factories/TextAssetFactory.h
  34. 34. Asset Factories FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/Factories/TextAssetFactory.cpp
  35. 35. Asset Factories
  36. 36. Asset Factories FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/Factories/TextAssetFactory.h FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/Factories/TextAssetFactory.cpp
  37. 37. Asset Actions IAssetTypeActions • Interface for all asset actions • Virtual functions to be overridden Factory Types • Appearance Display name, icon color, thumbnails etc. • Content browser options • Context menu actions
  38. 38. Asset Actions FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.h
  39. 39. Asset Actions FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.cpp
  40. 40. Asset Actions FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.cpp Note: Asset categories are currently implemented as enumerations, so that their total number is limited to 31 :(
  41. 41. Asset Actions
  42. 42. Asset Actions FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.cpp
  43. 43. Asset Actions FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.cpp
  44. 44. Anatomy of Modules Files • {ModuleName}.Build.cs Build rules & configuration • {ModuleName}.cpp Module implementation Directories • {ModuleName} This is where the module files live • {ModuleName}/Public Header files that are visible to other modules (optional) • {ModuleName}/Private Internal implementation of the module
  45. 45. Anatomy of Modules Files • {ModuleName}.Build.cs Build rules & configuration • {ModuleName}.cpp Module implementation Directories • {ModuleName} This is where the module files live • {ModuleName}/Public Header files that are visible to other modules (optional) • {ModuleName}/Private Internal implementation of the module
  46. 46. Anatomy of Modules Example: /Source/Test/Test.Build.cs /Source/Test/Private/TestModule.cpp
  47. 47. Anatomy of Modules Example: /Source/Test/Test.Build.cs /Source/Test/Private/TestModule.cpp
  48. 48. Asset Actions FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/TextAssetModule.cpp
  49. 49. Asset Thumbnails • Thumbnails can be any UI widget, incl. 3D viewports • TextAsset doesn’t implement thumbnails • Search the Engine code base for UThumbnailRenderer (if you’re curious)
  50. 50. Custom Asset Editors
  51. 51. Slate
  52. 52. Slate Slate UI Library • Written entirely in C++ • Platform agnostic (works on mobile and consoles, too) • SlateCore module provides low-level functionality • Slate module contains library of common UI widgets • Does not require Engine or Editor modules Current Use Cases • Unreal Editor • Standalone desktop applications • Mobile applications • In-game UI
  53. 53. Styling • Customize the visual appearance of your UI • Images (PNGs and Materials), Fonts, Paddings, etc. • Customizable user-driven layouts Input Handling • Keyboard, mouse, joysticks, touch • Key bindings support Slate Render Agnostic • Supports both Engine renderer and standalone renderers Large Widget Library • Layout primitives, text boxes, buttons, images, menus, dialogs, message boxes, navigation, notifications, dock tabs, list views, sliders, spinners, etc.
  54. 54. Declarative Syntax • Set of macros for declaring widget attributes • Avoids layers of indirection Composition • Compose entire widget hierarchies in a few lines of code • Uses fluent syntax for ease of use • Preferred over widget inheritance • Any child slot can contain any other widget type • Makes it very easy to rearrange UIs in code Slate
  55. 55. // Example custom button (some details omitted) class STextButton : public SCompoundWidget { public: SLATE_BEGIN_ARGS(SMyButton ) { } // The label to display on the button. SLATE_ATTRIBUTE(FText, Text) // Called when the button is clicked. SLATE_EVENT(FOnClicked, OnClicked) SLATE_END_ARGS() // Construct this button void Construct( const FArguments& InArgs ); }; // Button implementation (some details omitted) void STextButton::Construct ( const FArguments& InArgs ) { ChildSlot [ SNew(SButton) .OnClicked(InArgs._OnClicked) [ SNew(STextBlock) .Font(FMyStyle::GetFontStyle(“TextButtonFont")) .Text(InArgs._Text) .ToolTipText(LOCTEXT(“TextButtonToolTip", “Click Me!")) ]; ]; } Slate
  56. 56. Demo
  57. 57. Custom Asset Editors FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.h FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.cpp
  58. 58. Custom Asset Editors FMX2017/Plugins/TextAsset/Source/TextAssetEditor/Private/AssetTools/TextAssetActions.cpp
  59. 59. Custom Asset Editors Code Exploration
  60. 60. What You Learned Today UE4 Programming Basics • Structure of UE4 code base Files, Directories, Engine, Projects • Creating a UE4 plug-in Anatomy, Descriptor Files Extending the Engine & Editor • Adding new content asset types We’ll create an asset that stores text • Implementing asset factories New assets via context menu and drag & drop • Editor integration of assets Appearance, actions, custom UI
  61. 61. Questions? Documentation, Tutorials and Help • Answer Hub • Documentation • Forums • Issue Tracker • Wiki Other Resources • UE4 Road Map • YouTube Tutorials • Community Discord • Community IRC answers.unrealengine.com docs.unrealengine.com forums.unrealengine.com issues.unrealengine.com wiki.unrealengine.com trello.com/b/TTAVI7Ny/ue4-roadmap www.youtube.com/user/UnrealDevelopmentKit unrealslackers.org #unrealengine on FreeNode
  62. 62. You can download this presentation from SlideShare: http://www.slideshare.net/GerkeMaxPreussner You can clone or fork the TextAsset plug-in from GitHub: https://github.com/ue4plugins/TextAsset Gerke Max Preussner | Sr. Engine Programmer | Epic Games @gmpreussner | max.preussner@epicgames.com | linkedin.com/in/gmpreussner

×