HeroEngine Forums
Welcome, Guest. Please login or Register for HeroCloud Account.

Author Topic: color changer window  (Read 1035 times)

Thazager

  • General Accounts
  • *
  • Posts: 1137
  • Never stop learning
    • View Profile
    • Heroes and Villains MMORPG
color changer window
« on: Jan 30, 13, 03:03:29 AM »

This is for changing colors of on screen windows. It will also color the Logout window as an example.

From the basic window tutorial
Make basic window here. This is a base window and will be used in many of my Tutorials. It uses the GUI pics from textures that all engines have. This can be skipped if you have the basic window already from another tutorial.

Make basic button here. This will also be used in many of my tutorials.

_________________________________________________________________________
In the DOM, creat a new (client side) class.
name = TMP_ColorWindow
archtype = guicontrol
add a parent to the class, TMP_Window

click open script

In new script TMP_ColorWindowClassMethods

Code: [Select]
// create main window
shared function Start()
  var win = getColorWindow()
  if win <> None
    DestroyNode( win )
  .
  win = CreateNodeFromPrototype("TMP_ColorWindow")
  win.build = true
  MiscUtils:centerWindow(win)
.

// if you wanted each window to open with those same colors, you need to set them as they are made
// to have the colors perm, you need to save them in options
// the same can be done with text, just list which you want to change

// this changes the color for the window when the sliders move
method _onSliderValueChange(args references Class GUIValueChangeEvent)
  slide as NodeRef of Class GUISlider = args.source
  colorVal as Float = ((stof(args.value) + 10) / 20)   // calc 0.0 - 1.0 values

  // get current colors
  var realColor = me.getTitle()
  Red as Float = realColor.defaultStatePresentation.color.r
  Green as Float = realColor.defaultStatePresentation.color.g
  Blue as Float = realColor.defaultStatePresentation.color.b

  // get which color is changing
  when slide.parent.name
    is "redSlider"
      Red = colorVal
      var val = me.getRedVal()
      val.text = truncate(Red * 255)
    .
    is "greenSlider"
      Green = colorVal
      var val = me.getGreenVal()
      val.text = truncate(Green * 255)
    .
    is "blueSlider"
      Blue = colorVal
      var val = me.getBlueVal()
      val.text = truncate(Blue * 255)
    .
  .
  // put in new color - title
  newColor as Class rgba = MiscUtils:MakeRGBA( Red, Green, Blue, 1.0 )
  realColor.defaultStatePresentation.color = newColor

  // main window
  var win = getColorWindow()
  me.SetColorWin(win, newColor)

  // check for other windows - examples
  win = getExitWindow()
  me.SetColorWin(win, newColor)

  win = getLogoutWindow()
  me.SetColorWin(win, newColor)

  win = getMainLogWindow()
  me.SetColorWin(win, newColor)
.

// set the color of all the parts of the window
// things like this are the reason for building GUIs similar in style with a template
method SetColorWin(win as NodeRef of Class GUIControl, newColor as Class rgba)
  if win <> None
    part as NodeRef of Class GUIControl

    nameList as List of String
    names as String = "toppanel.left toppanel.right toppanel.mid "
    names += "bottompanel.left bottompanel.right bottompanel.mid "
    names += "left right"
    tokenize(names, nameList)

    loop i from 1 to 8
      part = FindGUIControlByName(win, nameList[i])
      part.defaultStatePresentation.color = newColor
      part.hoverStatePresentation.color = newColor
    .
  .
.

//=================================================================================================
// main window
function getColorWindow() as NodeRef of Class GUIControl
  return FindGUIControlByName(None, "game.TMP_ColorWindow")
.

method getTitle() as NodeRef of Class GUILabel
  return FindGUIControlByName(me, "title")
.

method getRedVal() as NodeRef of Class GUILabel
  return FindGUIControlByName(me, "Sliders.redVal")
.

method getGreenVal() as NodeRef of Class GUILabel
  return FindGUIControlByName(me, "Sliders.greenVal")
.

method getBlueVal() as NodeRef of Class GUILabel
  return FindGUIControlByName(me, "Sliders.blueVal")
.

//--------------------------------------------------------------------
// exit window
function getExitWindow() as NodeRef of Class GUIControl
  return FindGUIControlByName(None, "game.tmp_exitWarning")
.

// logout window
function getLogoutWindow() as NodeRef of Class GUIControl
  return FindGUIControlByName(None, "game.tmp_logWarning")
.

// main log window
function getMainLogWindow() as NodeRef of Class GUIControl
  return FindGUIControlByName(None, "game.tmp_logoutWindow")
.

_________________________________________________________________________
In new (XML) script TMP_ColorWindow

Code: [Select]
<createControlType inheritFrom='TMP_Window' class='TMP_ColorWindow' type='TMP_ColorWindow' description='' treePath='' name="TMP_ColorWindow">
  <size y="130"/>
  <set name="TMP_ColorWindow.BGpanel">
    <size y="122"/>
  </set>
  <_label name="title" scale="2" text="Color change" dropShadowAlpha="1" justification="CENTER">
    <defaultStatePresentation>
      <color r="1" g="0" b="0"/>
    </defaultStatePresentation>
    <autoCenter horizontal="true"/>
  </_label>
  <_panel name="Sliders">
    <position x="5" y="40"/>
    <size x="240" y="80"/>
    <defaultStatePresentation>
      <color a="0"/>
    </defaultStatePresentation>
    <hoverStatePresentation>
      <color a="0"/>
    </hoverStatePresentation>
    <_slider name="redSlider">
      <position x="10"/>
      <set name="TMP_ColorWindow.Sliders.redSlider.sliderTracks">
        <defaultStatePresentation>
          <color g="0" b="0"/>
        </defaultStatePresentation>
      </set>
      <set name="TMP_ColorWindow.Sliders.redSlider.thumb">
        <position x="83"/>
      </set>
    </_slider>
    <_slider name="greenSlider">
      <position x="10" y="30"/>
      <set name="TMP_ColorWindow.Sliders.greenSlider.sliderTracks">
        <defaultStatePresentation>
          <color r="0" b="0"/>
        </defaultStatePresentation>
      </set>
      <set name="TMP_ColorWindow.Sliders.greenSlider.thumb">
        <position x="83"/>
      </set>
    </_slider>
    <_slider name="blueSlider">
      <position x="10" y="60"/>
      <set name="TMP_ColorWindow.Sliders.blueSlider.sliderTracks">
        <defaultStatePresentation>
          <color r="0" g="0"/>
        </defaultStatePresentation>
      </set>
      <set name="TMP_ColorWindow.Sliders.blueSlider.thumb">
        <position x="83"/>
      </set>
    </_slider>
    <_label name="redVal" text="128" dropShadowAlpha="1" justification="CENTER">
      <position x="200"/>
      <size x="40"/>
      <defaultStatePresentation>
        <color r="1" g="0" b="0"/>
      </defaultStatePresentation>
    </_label>
    <_label name="greenVal" text="128" dropShadowAlpha="1" justification="CENTER">
      <position x="200" y="30"/>
      <size x="40"/>
      <defaultStatePresentation>
        <color r="0" g="1" b="0"/>
      </defaultStatePresentation>
    </_label>
    <_label name="blueVal" text="128" dropShadowAlpha="1" justification="CENTER">
      <position x="200" y="60"/>
      <size x="40"/>
      <defaultStatePresentation>
        <color r="0" g="0" b="1"/>
      </defaultStatePresentation>
    </_label>
  </_panel>
</createControlType>

_________________________________________________________________________
In (client side) script E_PlayerAccountClassMethods under the chatwindow,

Code: [Select]
      TMP_ColorWindowClassMethods:Start()
« Last Edit: Jun 01, 15, 01:15:40 PM by Thazager »
Logged