Skip to content

Quick Start

Hannele Ruiz edited this page Dec 3, 2023 · 13 revisions

Starting with LemonUI is easy! You just need to learn about a couple of things and you should be ready to go.

Remarks

This Quick Start guide assumes that you already know C#, how to use Events like Tick and use your development tools (Visual Studio, Rider, dotnet command line, etc).

The Project

To start, you need to create your csproj, or C# Project in your IDE like Visual Studio or Rider. You can even use the command line if you want to!

Create your project in Visual Studio, Rider or the command line, then make sure that you have set the right framework:

  • FiveM: .NET Framework 4.5.2
  • RageMP: .NET Core 2.2
  • RagePluginHook: .NET Framework 4.7.2
  • SHVDN3: .NET Framework 4.8

After you have your project up and running, we can proceed to the next step.

Adding the NuGet Packages

Then, add the respective NuGet Package:

The package names are LemonUI.SHVDN3, LemonUI.FiveM, LemonUI.RagePluginHook and LemonUI.RageMP.

After you have added your NuGet package and have your project ready, you are ready to continue!

Please note that some frameworks need some extra metadata files that you need to create, so make sure to read the framework documentation if you are not sure. The known special cases are the following:

FiveM

On FiveM, you need to add the following line to your fxmanifest.lua:

file "LemonUI.FiveM.dll"

The Object Pool

The Object Pool stores all of your UI Containers like Menus and Timer Bar Collections. While Object Pools are not mandatory for Menus to work, they provide extra features like updating the position of your UI when the Resolution and Safe Zone are changed, and being able to change multiple processable elements at once.

You can create a new Object Pool by calling it's constructor. It does not takes any parameters.

// Recommendation: Make this a private readonly field
ObjectPool pool = new ObjectPool();

When using the Object Pool, you need to call a function every Tick to make sure that is able to detect changes and draw the UI elements. This function is called Process().

// This goes inside of your Tick event
pool.Process();

After adding the Object Pool, you are ready to add Menus, Timer Bars and Scaleforms!

Menus and Items

LemonUI allows you to create Rockstar-like menus with the NativeMenu class. You can create them by calling the constructor with the Banner Text of the menu.

// Recommendation: Make this a readonly field
NativeMenu menu = new NativeMenu("Banner Text", "Name", "Description");
// If you don't plan to use a banner, you can set the banner text to an empty string
NativeMenu menu = new NativeMenu("", "Name", "Description", null);

Just remember that all of the Menus need to be added into an Object Pool, including submenus!

pool.Add(menu);

After this, your new menu is ready to work. You can show them on the screen by setting the Visible property to true.

Now, let's continue with the Menu Items. There are multiple types of items that you can use in your menu:

Normal Items

The normal items only show a Title and that's it. They are simple, but have a lot of features that you can change (check the Visual Studio Object Browser for more information).

You can create them like this:

NativeItem item = new NativeItem("Title"); // No Description
NativeItem item = new NativeItem("Title", "Description of the Item"); // With Description
NativeItem item = new NativeItem("Title", "Description of the Item", "Info"); // With Description and Alternative Title on the right

Then, you are free to add it onto the menu by calling Add():

menu.Add(item);

All of the menu items are added with the same function, no matter their type.

Checkbox Items

Checkbox Items work and behave like normal items, but they have a Checkbox that can be toggled on and off. You create them like this:

NativeCheckboxItem checkbox = new NativeCheckboxItem("Checkbox"); // Disabled by Default
NativeCheckboxItem checkbox = new NativeCheckboxItem("Checkbox", true); // Enabled by Default
NativeCheckboxItem checkbox = new NativeCheckboxItem("Checkbox", "Description"); // Disabled by Default with a Description
NativeCheckboxItem checkbox = new NativeCheckboxItem("Checkbox", "Description", true); // Enabled by Default with a Description

You can check if the Checkbox is toggled on or off by checking the Checked property.

List Items

List Items have a list of items that you can change by scrolling left and right.

On LemonUI, you need to specify the type of items that they will have, like this:

NativeListItem<string> // List of Strings
NativeListItem<int> // List of Int
NativeListItem<Color> // List of Colors

As an example, we will create list of ints:

NativeListItem<int> list = new NativeListItem<int>("Title"); // No Description
NativeListItem<int> list = new NativeListItem<int>("Title", "Description of the Item"); // With Description

You can add the objects that you want on the item when you create it by specifying them after the parameters, like this:

NativeListItem<int> list = new NativeListItem<int>("Title", 1, 2, 3, 4); // No Description with 1, 2, 3 and 4 as items
NativeListItem<int> list = new NativeListItem<int>("Title", "Description of the Item", 177013); // With Description with 177013 as an item

You can get the current item via the SelectedItem property, and the current index via the SelectedIndex property.

Slider Item

LemonUI has Sliders that you can move from Left to Right to change a numeric value. They can be created like this:

NativeSliderItem item = new NativeSliderItem("Title"); // No Description with a Maximum of 100 and a Value of 0
NativeSliderItem item = new NativeSliderItem("Title", "Description"); // With Description, a Maximum of 100 and a Value of 0
NativeSliderItem item = new NativeSliderItem("Title", 255, 160); // No Description with a Maximum of 255 and a Value of 160
NativeSliderItem item = new NativeSliderItem("Title", "Description", 255, 160); // With Description, a Maximum of 255 and a Value of 160

You can get the value with the Value property. There is also another property called Multiplier that will set the increase when moving the slider (for example, increase the numeric value by 10 instead of by 1).

Submenus

NativeMenu's allows you to add another menu as a submenu for quickly building menu navigation. You can add a submenu to an existing menu with the AddSubMenu function, like this:

NativeMenu mainMenu = new NativeMenu("Main Menu");
NativeMenu subMenu = new NativeMenu("Sub Menu");
NativeSubmenuItem itemThatOpensTheMenu = mainMenu.AddSubMenu(subMenu);

The function will return a NativeSubmenuItem. You can use this item to customize the item that opens up the submenu or make some permission checks before opening the menu.