{"id":11131,"date":"2024-11-16T05:57:17","date_gmt":"2024-11-16T03:57:17","guid":{"rendered":"https:\/\/store.algosyntax.com\/?post_type=asx-lms-tutorial-cpt&#038;p=11131"},"modified":"2026-04-08T23:59:39","modified_gmt":"2026-04-08T21:59:39","slug":"umg-spliter-widget-enhanced-ui-plugin","status":"publish","type":"documentation","link":"https:\/\/store.algosyntax.com\/documentation\/umg-spliter-widget-enhanced-ui-plugin\/","title":{"rendered":"UMG Spliter Widget: Enhanced UI Plugin"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"11131\" class=\"elementor elementor-11131\" data-elementor-post-type=\"documentation\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e49a59a e-flex e-con-boxed e-con e-parent\" data-id=\"e49a59a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-145dbdc elementor-widget elementor-widget-text-editor\" data-id=\"145dbdc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Bring the power of Slate&#8217;s SSpliter widget to UMG and blueprints. The SSplitter allows you to dynamically resize sections of your UI at runtime, giving your end users are better experience when it comes to UI management.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-48f8722 elementor-widget elementor-widget-button\" data-id=\"48f8722\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/enhanced-ui\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Enhanced UI Plugin Full Feature List<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c1d2866 elementor-widget elementor-widget-heading\" data-id=\"c1d2866\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Tutorial\/Trailer Video<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fa33a45 elementor-widget__width-initial elementor-widget elementor-widget-video\" data-id=\"fa33a45\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/MPVhuWag0ak&quot;,&quot;video_type&quot;:&quot;youtube&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5a6f58c elementor-widget elementor-widget-text-editor\" data-id=\"5a6f58c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>It is designed to divide its allotted area into multiple segments, with the number of segments corresponding to the number of child elements it has. This capability allows developers to create flexible, resizable layouts within their user interfaces, making it an essential widget for dynamic UI design in Unreal Engine.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f625bca elementor-widget elementor-widget-heading\" data-id=\"f625bca\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Adding The Widget \"SplitterPanel\" to your UMG<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-26ceef1 elementor-widget elementor-widget-image\" data-id=\"26ceef1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"931\" height=\"226\" src=\"https:\/\/store.algosyntax.com\/wp-content\/uploads\/edd\/marketplace\/unreal-engine\/enhancedui\/splitter-widget.jpg\" class=\"attachment-large size-large wp-image-9391\" alt=\"\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ccffda3 elementor-widget elementor-widget-text-editor\" data-id=\"ccffda3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Once you&#8217;ve installed and activated the plugin, you&#8217;ll find the &#8220;SpitterPanel&#8221; widget among your list of widgets.<br \/>Add this to your scene.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d2d8867 elementor-widget elementor-widget-heading\" data-id=\"d2d8867\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Properties of SplitterPanel<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d7bbbf9 elementor-widget elementor-widget-image\" data-id=\"d7bbbf9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"418\" height=\"266\" src=\"https:\/\/store.algosyntax.com\/wp-content\/uploads\/edd\/marketplace\/unreal-engine\/enhancedui\/splitter-options.jpg\" class=\"attachment-large size-large wp-image-9393\" alt=\"\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d965bfb elementor-widget elementor-widget-text-editor\" data-id=\"d965bfb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>The Splitter Panel works more or less the same way as the horizontal or vertical box widgets. On the layout section, you can choose the Orientation of child widgets.\u00a0<br \/>If you choose &#8220;Horizontal&#8221; , it will behave like the Horizontal Box. If you choose the &#8220;Vertical&#8221; , it will behave like the vertical box in terms of orienting the child widgets.<br \/><br \/>You can also set the Handle Size and its Color under &#8220;Splitter Style&#8221;.<br \/><br \/>Watch and follow the video tutorial above if you&#8217;re confused.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6884194 elementor-widget elementor-widget-button\" data-id=\"6884194\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/enhanced-ui\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Get The Enhanced UI Plugin<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"featured_media":0,"template":"elementor_header_footer","categories":[129,132],"tags":[],"class_list":["post-11131","documentation","type-documentation","status-publish","hentry","category-unreal-engine","category-enhanced-ui","entry"],"acf":[],"_links":{"self":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/documentation\/11131","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/documentation"}],"about":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/types\/documentation"}],"version-history":[{"count":2,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/documentation\/11131\/revisions"}],"predecessor-version":[{"id":13356,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/documentation\/11131\/revisions\/13356"}],"wp:attachment":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/media?parent=11131"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/categories?post=11131"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/tags?post=11131"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}