Resource:DGS: Difference between revisions

From Multi Theft Auto: Wiki
Jump to navigation Jump to search
No edit summary
(Undo revision 59097 by Lizzalka (talk))
Line 1: Line 1:
<font face="sans-serif">
<pageclass class="resource" subcaption="Resource"></pageclass>
<div style="background:#333;">
[[Image:DGS_Logo.png|400px|thumb|right|DGS Logo By [[User:Allerek|Allerek]]]]
<div style="height:4px;background:#AAA;"></div>
This resource is designed to allow you to create directX GUI's as an alternative to the original MTA:SA GUI functions.
<font color="#FFF" size="5">
 
<p>&nbsp;Ваша версия Adobe Flash Player устарела</p>
 
</font>
'''Full Name''': Thisdp's DirectX Graphical User Interface System (DxGUI Lib)
<div style="background:#FFF;">
 
<font color="#F00" size="2">
'''Author''': [[User:thisdp|thisdp]]
<p>Требуется срочное обновление до текущей версии!</p>
 
</font>
'''State''': OpenSourced & Work in progress
<font color="#000" size="4">
 
<p>Adobe Flash Player 30.0.0.164 <font color="#888" size="2">(~18 kB)</font></p>
'''GitHub Source''': https://github.com/thisdp/dgs/tree/master
</font>
 
<font color="#444" size="2">
'''Server Discord''': https://discord.gg/QEs8q6W
<p><b>Операционная система:</b> Windows<br><b>Язык:</b> Выбирает пользователь</p>
 
</font>
 
<font color="#000" size="4">
 
<p>Скачать обновление с Яндекс.Диска: yadi.sk/d/AfbiMAr1PkGdww</p>
=Features=
</font>
 
</div>
[[Image:DGSNetStatus.png|300px|thumb|right|DGS Network Monitor]]
</div>
 
</font>
[[Image:DGSS.png|400px|thumb|right|]]
 
 
'''How does it work?'''
*DGS is based on [[element]] system, which just likes the cegui system. To make DGS easier to use and understand, I choose to follow the usage of cegui's.
*DGS elements are rendered in the event "onClientRender". When "onClientRender" is called, every DGS elements will be looped and calculated.
 
 
'''What's different from cegui?'''
*This resource is based on dx* functions, so its style will be more flexible than cegui, which means you can define the style by yourself.
*The latest '''Style System''' enables developer to define their own style such as changing color, loading images and even loading shaders with dgs elements on the server instead of using a lot of [[dgsSetProperty]]/[[dgsSetProperties]].
 
 
'''Update System'''
*It have an update system that can inform you of keeping your DGS latest.
*When a newer version has been released, it will detecte the version changing periodically and then notice you.
*Execute command "'''updatedgs'''" to check the least version and update your DGS.
*Also, you can check the version of DGS by inputting the command "dgsver"  
 
 
'''You Should Know'''
*Scroll Pane, Grid List, Combo Box, Memo and Edit Box use Render Target, which means if you don't have enough video memory, '''Render Target won't be created''', and therefore those dgs elements won't be shown.
 
 
[[Image:Dx_7.PNG|400px|thumb|right|Example DGS Cmd]]
 
'''Examples scripts'''
*1.https://community.multitheftauto.com/index.php?p=resources&s=details&id=14757 By ([[User:Ahmed Ly|Ahmed Ly]] ,Mahmod Algeriany)
*2. Also File test.lua its have more Examples You can See it .
*3. This Video show you how to play a video by using Dgs https://www.youtube.com/watch?v=ZIq24zS5byI
 
 
'''Auto Completion'''
*1. Link: http://www.mediafire.com/file/m6dm7815d5dihax/lua.zip  By [[User:Ahmed Ly|Ahmed Ly]]
*2. '''Note''': You must put it in file Notepad++\plugins\APIs.
*3. Not all of DGS Functions are added, but the rest will be added soon.
 
 
'''Debug'''
* You can enter the debug mode by executing the command "'''debugdgs'''".
 
 
'''DGS Type'''
[[Image:Dx Dgs.jpg|400px|thumb|right|Hurt World GUI Example]]
* 3D Interface (dgs-dx3dinterface): A 3D Interface.
* Arrow List (dgs-arrowlist): An arrow list.
* Button (dgs-dxbutton): A button.
* Ellipse Detect Area (dgs-dxeda): An oval detect area.
* Edit (dgs-dxedit): An edit.
* Memo (dgs-dxmemo): A memo.
* Gridlist (dgs-dxgridlist): A grid list.
* Image (dgs-dximage): A dynamic image.
* Label (dgs-dxlabel): A text label.
* Detect Area (dgs-dxdetectarea): A custom detect area.
* ScrollBar (dgs-dxscrollbar): A scroll bar.
* ScrollPane (dgs-dxscrollpane): A scroll pane.
* Tab Panel (dgs-dxtabpanel + dgs-dxtab) : A tab panel.
* Window (dgs-dxwindow): A window.
* Progress Bar (dgs-dxprogressbar): A Progress Bar.
* Radio Button (dgs-dxradiobutton): A Radio Button.
* Combo Box (dgs-dxcombobox + dgs-dxcombobox-Box) : A combo box.
* Check Box (dgs-dxcheckbox) : A check box that with 3 states (checked, unchecked and indeterminate).
* Media Browser (dgs-dxmedia) : A media browser that is used to load video/audio/gif.
* Browser (dgs-browser) : A dgs browser.
 
'''Notice'''
*It is recommended to change the resource name to 'dgs'.
*This is a resource, if you want to use the functions exported by this resource,  you should use an exported function prefix ('''exports.dgs:''') call in your code, such as
<syntaxhighlight lang="lua">
label = exports.dgs:dgsCreateLabel(0, 0, 0.5, 0.1, "text", true)
</syntaxhighlight>
*Here is a feasible way to shorten the name of an exported function:
<syntaxhighlight lang="lua">
DGS = exports.dgs --shorten the export function prefix
label = DGS:dgsCreateLabel(0,0,0.5,0.1,"text",true) --create a label
</syntaxhighlight>
*From the latest version, it no longer needs '''exports.dgs:''', instead we can do
<syntaxhighlight lang="lua">
loadstring(exports.dgs:dgsImportFunction())()-- load functions
label = dgsCreateLabel(0,0,0.5,0.1,"text",true) --create a label
</syntaxhighlight>
'''Object Oriented Programming'''
<syntaxhighlight lang="lua">
loadstring(exports.dgs:dgsImportOOPClass())()-- load OOP class
window = DGSClass:createWindow(0,0,0.5,0.1,"test",true) --create a window with oop
label = window:createLabel(0,0,1,1,"label",true) --create a label inside the window
label.text = "DGS OOP Test" --set text
</syntaxhighlight>
 
'''Want to talk to us?'''
*Join Discord Server: https://discord.gg/QEs8q6W
 
 
'''Special thanks to the following for their help (Respect the contributors)''':
[[Image:Tab.PNG |200px|thumb|right|Example tab panel and label .]]
* Axel: Gives some tips and provide some functions.
* Senpai: Helps with wiki.
* ZoNe: Helps with wiki.
* DiGiTal: Helps with wiki.
* #Dv^: Helps with wiki.
* maksam07: Suggestions, BUG Fixing and coding.
* Scorpyo: Debug and Suggestions.
* Kingleonide: Debug, Sugestions and Code Edit.
* Bullet(.el3tar): Makes video course of dgs for arabics.
* Allerek: DGS Logo Design, Wiki writing(PL).
* Deihim007: Helps with wiki, Gives suggestiongs.
 
Special thanks to:
* Ahmed Ly: Helps write wiki, release auto completion for N++.
 
='''DGS Tips'''=
*[[DGS Events and GUI Events]]
*[[DGS Grid List]]
*[[DGS OOP Class]]
*[[DGS Style System]]
 
='''DGS Element Properties'''=
{{DGSPROPERTIES}}
 
='''Client Functions'''=
{{DGSFUNCTIONS}}
 
=Client Events=
{{DGSEVENTS}}
 
=Last=
'''Everyone is welcome to make suggestions, test the script, help make adjustments/finish the wiki, etc.'''
[[Category:Resource]]
 
[[ar:Dgs]]
[[ZH-CN:Dgs]]
[[PL:Dgs]]

Revision as of 06:18, 9 September 2018

DGS Logo By Allerek

This resource is designed to allow you to create directX GUI's as an alternative to the original MTA:SA GUI functions.


Full Name: Thisdp's DirectX Graphical User Interface System (DxGUI Lib)

Author: thisdp

State: OpenSourced & Work in progress

GitHub Source: https://github.com/thisdp/dgs/tree/master

Server Discord: https://discord.gg/QEs8q6W


Features

DGS Network Monitor
DGSS.png


How does it work?

  • DGS is based on element system, which just likes the cegui system. To make DGS easier to use and understand, I choose to follow the usage of cegui's.
  • DGS elements are rendered in the event "onClientRender". When "onClientRender" is called, every DGS elements will be looped and calculated.


What's different from cegui?

  • This resource is based on dx* functions, so its style will be more flexible than cegui, which means you can define the style by yourself.
  • The latest Style System enables developer to define their own style such as changing color, loading images and even loading shaders with dgs elements on the server instead of using a lot of dgsSetProperty/dgsSetProperties.


Update System

  • It have an update system that can inform you of keeping your DGS latest.
  • When a newer version has been released, it will detecte the version changing periodically and then notice you.
  • Execute command "updatedgs" to check the least version and update your DGS.
  • Also, you can check the version of DGS by inputting the command "dgsver"


You Should Know

  • Scroll Pane, Grid List, Combo Box, Memo and Edit Box use Render Target, which means if you don't have enough video memory, Render Target won't be created, and therefore those dgs elements won't be shown.


Example DGS Cmd

Examples scripts


Auto Completion


Debug

  • You can enter the debug mode by executing the command "debugdgs".


DGS Type

Hurt World GUI Example
  • 3D Interface (dgs-dx3dinterface): A 3D Interface.
  • Arrow List (dgs-arrowlist): An arrow list.
  • Button (dgs-dxbutton): A button.
  • Ellipse Detect Area (dgs-dxeda): An oval detect area.
  • Edit (dgs-dxedit): An edit.
  • Memo (dgs-dxmemo): A memo.
  • Gridlist (dgs-dxgridlist): A grid list.
  • Image (dgs-dximage): A dynamic image.
  • Label (dgs-dxlabel): A text label.
  • Detect Area (dgs-dxdetectarea): A custom detect area.
  • ScrollBar (dgs-dxscrollbar): A scroll bar.
  • ScrollPane (dgs-dxscrollpane): A scroll pane.
  • Tab Panel (dgs-dxtabpanel + dgs-dxtab) : A tab panel.
  • Window (dgs-dxwindow): A window.
  • Progress Bar (dgs-dxprogressbar): A Progress Bar.
  • Radio Button (dgs-dxradiobutton): A Radio Button.
  • Combo Box (dgs-dxcombobox + dgs-dxcombobox-Box) : A combo box.
  • Check Box (dgs-dxcheckbox) : A check box that with 3 states (checked, unchecked and indeterminate).
  • Media Browser (dgs-dxmedia) : A media browser that is used to load video/audio/gif.
  • Browser (dgs-browser) : A dgs browser.

Notice

  • It is recommended to change the resource name to 'dgs'.
  • This is a resource, if you want to use the functions exported by this resource, you should use an exported function prefix (exports.dgs:) call in your code, such as
label = exports.dgs:dgsCreateLabel(0, 0, 0.5, 0.1, "text", true)
  • Here is a feasible way to shorten the name of an exported function:
DGS = exports.dgs --shorten the export function prefix
label = DGS:dgsCreateLabel(0,0,0.5,0.1,"text",true) --create a label
  • From the latest version, it no longer needs exports.dgs:, instead we can do
loadstring(exports.dgs:dgsImportFunction())()-- load functions
label = dgsCreateLabel(0,0,0.5,0.1,"text",true) --create a label

Object Oriented Programming 

loadstring(exports.dgs:dgsImportOOPClass())()-- load OOP class
window = DGSClass:createWindow(0,0,0.5,0.1,"test",true) --create a window with oop
label = window:createLabel(0,0,1,1,"label",true) --create a label inside the window
label.text = "DGS OOP Test" --set text

Want to talk to us?


Special thanks to the following for their help (Respect the contributors):

Example tab panel and label .
  • Axel: Gives some tips and provide some functions.
  • Senpai: Helps with wiki.
  • ZoNe: Helps with wiki.
  • DiGiTal: Helps with wiki.
  • #Dv^: Helps with wiki.
  • maksam07: Suggestions, BUG Fixing and coding.
  • Scorpyo: Debug and Suggestions.
  • Kingleonide: Debug, Sugestions and Code Edit.
  • Bullet(.el3tar): Makes video course of dgs for arabics.
  • Allerek: DGS Logo Design, Wiki writing(PL).
  • Deihim007: Helps with wiki, Gives suggestiongs.

Special thanks to:

  • Ahmed Ly: Helps write wiki, release auto completion for N++.

DGS Tips

DGS Element Properties

General Properties

Unique Properties For DGS Core Elements

Extra Properties For DGS Plugins

Client Functions

Custom Cursor Functions

Multi Language Supports

Animation

3D Element

3D Interface

3D Line

3D Image

3D Text

Browser

Button

Check Box

Combo Box

Custom Renderer

Edit

Detect Area

Drag'N Drop

Grid List

Image

Memo

Menu

Label

Layout

Line

Progress Bar

Radio Button

Scale Pane

Scroll Bar

Scroll Pane

Selector

Style

Switch Button

Tab Panel

Window

Basic Shape Plugins

Circle

Quadrilateral

Rounded Rectangle

Other Plugins

Blur Box

Canvas

Chart

Color Picker

Effect 3D

Gradient

Mask

Media Browser

Nine Slice

Object Preview Supports

Paste Handler

QRCode

Remote Image

Screen Source

SVG

Tooltips

Client Events

General

Check Box

Combo Box

Drag'N Drop

Edit

Grid List

Menu

Selector

Mouse

Radio Button

Switch Button

Tab

Animation

Plugin

Media

Color Picker

QRCode

Remote Image

Last

Everyone is welcome to make suggestions, test the script, help make adjustments/finish the wiki, etc.

Retrieved from "https://wiki.multitheftauto.com/wiki/Resource:DGS?oldid=59107"