Slate Tutorial

Andargor · March 31, 2014, 9:45pm

I added a request in the Feedback section for more Slate info

EDIT: And now there is a poll, go vote

Agentleo · April 1, 2014, 1:21am

I will see if I have time to put something together tonight and post it here.

Agentleo · April 1, 2014, 8:20am

How to make a menu in-game (MenuBar). Where is it created, how to have callbacks

This is explained in Slate documentation you use FMenuBuilder below is an example of a Menu being created when a button is clicked
without using FReply parameters.



SNew(SButton)
.OnClicked(this, &Class::OnOpenClicked )



TSharedRef<SWidget> Class::OnOpenClicked()
{
	FMenuBuilder MenuBuilder(commands);
	{ 
		//create Menu items
	}

       //create and return Menu widget
	return MenuBuilder.MakeWidget();
}

As I get further into Slate I am pretty amazed by it. If you look at SWidgetGalley , and SLayoutExamples it provides examples on most of the widgets you need to get started. I just wait fool around with a few more things over next few days and then I may make a simple Menu

Agentleo · April 4, 2014, 1:35am

Below is a very simplified example of creating a Menu using FMenuBuilder. I have a more advance system in place in my personal project but without having time to create an actual tutorial most of what I am doing and why would not be understood. This should help people understand FMenuBuilder widget in slate and a simple callback of OnClicked.



#pragma once

#include "Slate.h"


class SMenu: public SCompoundWidget


public:
	SLATE_BEGIN_ARGS(SMenu)
	{}

	SLATE_END_ARGS()


		// Constructor for slate widgets
		void Construct(const  FArguments& InArgs);


private:

	//Start  button callback 
	FReply StartBtnClicked();

//Options  button callback 
        FReply OptionsBtnClicked();

//Credits  button callback 
        FReply CreditsBtnClicked();

//Exit  button callback 
        FReply ExitBtnClicked();


//Function to Create Menu 
	TSharedRef<SWidget> MyMenu();
};

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
SMenu.cpp
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
#include SMenu.h



// Constructor
void SMainMenu::Construct(const FArguments& InArgs)
{
	
	
	ChildSlot
		
			SNew(SOverlay)

//create slot on  overlay for Menu
			+ SOverlay::Slot()
			.HAlign(HAlign_Center)
			.VAlign(VAlign_Center)
			
			// create Menu widget
					MyMenu()	
			]	
		];

}



TSharedRef<SWidget> SMainMenu::MyMenu()
{
	FMenuBuilder MenuBuilder(true, NULL, TSharedPtr<FExtender>(), false, &FCoreStyle::Get());
	{
	
	
		MenuBuilder.AddWidget(SNew(SButton)
			.Text(FText::FromString("Start"))
			.OnClicked(this, &SMainMenu::StartBtnClicked)
			, FText::GetEmpty());

		MenuBuilder.AddWidget(SNew(SButton)
			.Text(FText::FromString("Options"))
			.OnClicked(this,&SMainMenu::OptionsBtnClicked)
			, FText::GetEmpty());

		MenuBuilder.AddWidget(SNew(SButton)
			.Text(FText::FromString("Credits"))
			.OnClicked(this,&SMainMenu::CreditsBtnClicked)
			, FText::GetEmpty());

		MenuBuilder.AddWidget(SNew(SButton)
			.Text(FText::FromString("Exit"))
			.OnClicked(this,&SMainMenu::ExitBtnClicked)
			, FText::GetEmpty());
	}


	return  MenuBuilder.MakeWidget();

}




//Start  button callback 
FReply SMenu::StartBtnClicked()
{

	return FReply::Handled();

}

//Options  button callback 
FReply SMenu::OptionsBtnClicked()
{

	return FReply::Handled();

}

//Credits  button callback 
FReply SMenu::CreditsBtnClicked()
{

	 return FReply::Handled();

}

//Exit  button callback 
FReply SMenu::ExitBtnClicked()
{

	return FReply::Handled();

}

Andargor · April 4, 2014, 1:00pm

Thanks for this, it is very useful. Where would this code be called from to create it? A BeginPlay() somewhere?

StrangerGwenn · April 4, 2014, 7:20pm

I can’t follow the tutorial with my project. Every include just breaks, no .h is ever found, no matter where, it’s a disaster. How do you even build the thing without having an error on each include file ? Where are you supposed to really put the sources ? In the private, public, classes folder ? Project root ? C:\Windows\System32 ?

The sample MyHUD.h file references the Widget class without any include. This does not work and I can’t begin to understand why it should.

Seriously, how do you build that ?

Agentleo · April 4, 2014, 9:25pm

The above is just the swidget not the HUD class you can create the swidget in your HUD class using defaulthud = yourhudclass::staticclass();

In regards to your personal files default location vs uses is project directory. You can move files to your project source folder but you must include the projects header as first include.

StrangerGwenn · April 4, 2014, 9:57pm

Yeah I know, it just does not work. Whatever I do, there is no way to include MyUIWidget.h, wether from the global Project.h or the MyUIWidget.cpp, if the .h is in the Private folder. If it is in the Public folder, the compiler requires me to uinclude the MyUIWidget.generated.h, which does not exist.

EDITED : Current solution is to put all Slate code in Private and include ProjectName/Private/SlateFileName.h from the main ProjectName.h file.

anonymous_user_0dc1700e · April 5, 2014, 2:08am

@Gwenn you aren’t going to have a MyUIWidget.generated.h. I don’t even have one of those in my tutorial, include MyUIWidget.generated.h isn’t part of any of my files. Also, what do you mean by “public folder” or “private folder”. The tutorial states the files go in /projectroot/sources/projectname/, wherever that is on your C: D: E: drive (whatever) depends on your own setup, but really you could put them wherever you want and edit the include directive appropraitely, some basic knowledge of filesystems is of course required.

!UPDATE!
I have some new code-samples up for screening. It isn’t on the front wiki page yet. It’s taken me so long to get some work out because I had a hardware failure, I’ve been racing trying to get my environment back to where it was, reinstall Windows, everything installed, download visual studio, stabilize my new hardware/bios settings, install drivers, re-write all the code I lost, re-produce some programmer art, re-download UE4 and all the sample projects, write new code etc etc, etc etc… But here they are, description is within, highly recommended you master Hello Slate first before trying to tackle it, this is quite a bit more complicated.
https://wiki.unrealengine.com/Loading_Slate_Styles_%26_Resources

StrangerGwenn · April 5, 2014, 7:43am

Hey, thank you so much for all of this. I wrote a tutorial on UDK some years ago, I know the hassle it can be. I did a clean rebuild with a correct file structure; no Classes or Private folders like in the ShooterGame demo, but with hard includes to my files in <ProjectName>.h, and this seems to work. Working on your style tutorial right now, thanks !

StrangerGwenn · April 5, 2014, 9:33am

Ok, so here is some feedback !

Some /////File: comments are wrong, if you understand what you’re doing it’s not an issue but is could mislead people
Having function bodies from different classes in the same file, like SMyUIWidget:: and FMyUIResources:: looks wrong to me. Sure it works, but it’s neither clean nor necessary IMHO.

Aside from that, THANK YOU, this is really great.

anonymous_user_0dc1700e · April 6, 2014, 4:20am

I believe the MyProject.cpp file was commented as MyProject.h . Fixed.

Thanks.

Andargor · April 8, 2014, 2:19am

Bleak, thanks for the tutorial. I’ve been trying to follow it, however, I get the following assert when I try and compile in the editor:



[2014.04.08-02.16.33:007][713]LogWindows:Error: appError called: Assertion failed: !FindSlateStyle( SlateStyleName ) [File:D:\BuildFarm\buildmachine_++depot+UE4-Releases+4.0\Engine\Source\Runtime\Slate\Private\SlateStyleRegistry.cpp] [Line: 12]

Seems related to loading a style, but where is this style located?

Andargor · April 8, 2014, 9:32pm

Specifically, it’s this line in MyGameResources.cpp that causes the crash on compile:



FSlateStyleRegistry::RegisterSlateStyle(*MyUIResources);

Ideas?

Agentleo · April 9, 2014, 2:58am

Just glancing at his code did you update the path info for your slate project? Also would check to make sure myUIresouce pointer is not null at the point .

Andargor · April 9, 2014, 3:32pm

The path might be the issue, as well as initialization. I’m still confused as to which path goes where.

As a side note, I see other AnswerHub questions relating to this, one from Gwenn here, which I also have been experiencing:

I really hope they fix Slate up soon…

Dingo_aus · May 10, 2014, 5:51am

Does it matter which “Solution Configuration” Visual Studio is in when compiling? Does it impact the use in the Editor? If so, which is best to use?

Andargor · May 10, 2014, 4:21pm

Yes, Development Editor/Windows. Otherwise you will have some strange compilation errors related to generated files.

Akuthia · May 30, 2014, 2:12pm

Hey everyone, new UE4 dev here, and having a problem trying to get this to work. I think that my problem is that the last two files are being placed in \MyProject\Intermediate\ProjectFiles\ and not in \MyProject\Source\MyProject\ . Does anyone have an idea as to what I’m doing wrong?

anonymous_user_0dc1700e · June 28, 2014, 9:13pm

That will do it. If the files are in the wrong directory the include directives will break. By default Visual Studio puts new files in /MyProject/Intermediate/ProjectFiles/ when you “add new files” to your project.