Muk TextField

Table of Contents

Create Muk Text Field
Muk Text Field Code
Muk TextField - Properties

Create Muk Text Field #

To create MukTextField, create and select MukUICanvas, right-click in the Hierarchy > Muk > TextField. You will see a new object(MukTextField) created in the selected canvas or the first canvas in the Hierarchy (if no canvas is selected). If there’s no canvas in the Hierarchy, Muk will create a MukUICanvas for you and place the MukTextField in the newly created MukUICanvas.

Muk Text Field Code #

You can get and set the text of the textfield or set call backs via script. Please see the code.


using Muk;

// Assign MukTextField in the Inspeactor window.
[SerializeField] private MukTextField mukTextField;

private void Start()
{
    //Text Field
    mukTextField.text = "Text set by code";
    mukTextField.onPrefixClick.AddListener(OnPrefixClick);
    mukTextField.onSuffixClick.AddListener(OnSuffixClick);
    mukTextField.onValueChanged.AddListener(OnValueChanged);
    mukTextField.onEndEdit.AddListener(OnEndEdit);
    mukTextField.onSelect.AddListener(OnSelect);
    mukTextField.onDeselect.AddListener(OnDeselect);
    
    print("text is " + mukTextField.text);
}
    
private void OnPrefixClick()
{
    print("OnPrefixClick");
}

private void OnSuffixClick()
{
    print("OnSuffixClick");
}

private void OnValueChanged(string value)
{
    print("OnValueChanged " + value);
}

private void OnEndEdit(string value)
{
    print("OnEndEdit " + value);
}

private void OnSelect(string value)
{
    print("OnSelect " + value);
}

private void OnDeselect(string value)
{
    print("OnDeselect " + value);
}

Muk TextField - Properties #

Property	Desciption	Value
Platform Type	Which UI Platform should Muk Components display.	Device - Base on device. iOS UI for iOS device, Material design for others. iOS - iOS design. Material - Material design.
Dark Mode	Use Dark mode or light mode. You can set color for each mode in theme settings.	Dark - Dark Mode. Light - Light Mode.
Content Type	The textfield type, like email, numbers...
Override Stroke Color	Should override the border color of the textfield?	If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings.
Override Background Color	Should override the background color of the textfield?	If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings.
Overrider Text Color	Should override the text color of the textfield?	If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings.
Overrider Placeholder text Color	Should override the placeholder / hint text color of the textfield?	If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings.
Overrider Caret Color	Should override the caret color of the textfield?	If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings.
Overrider Prefix Icon Color	Should override the left icon color of the textfield?	If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings.
Overrider Suffix Icon Color	Should override the right icon color of the textfield?	If ticked, it will show two options - iOS & Material, and each option will have two options inside(Light Mode color / Dark Mode Color). If not ticked, the system will get color from theme settings.
Is Show Prefix	Should show left icon or not?
Prefix Sprite	The image sprite of the left icon.
Is Show Suffix	Should show right icon or not?
Suffix Sprite	The image of the right icon.
Title Text (Material Only)	The title text of the textfield.
Text	The text of the textfield.
Placeholder Text	The text of the placeholder / hint text.
OnPrefixClick	Call back for when the left icon is clicked.
OnSuffixClicked	Call back for then the right icon is clicked.
OnValueChangeed	Call back for when the text changed
OnEndEdit	Call back for when user end the edit of the textfield
OnSelect	Call back for when textfield is selected by user.
OnDeselect	Call back for when user deselect the textfield.

Quick Start

Muk Settings

Scene Management

Muk Components

Muk Setting Page

Muk TextField

Create Muk Text Field #

Muk Text Field Code #

Muk TextField - Properties #