Показано с 1 по 6 из 6

Тема: Урок HUD Designer

  1. #1

    По умолчанию Урок HUD Designer

    Приветствую. Хочу с вами поделится, зарубежной системой автоматизированного создания интерфейса. В чем суть? В том, что на панель мы выносим нужные нам элементы, присваиваем им определенные свойства и нажимаем сгенерировать скрипт. В итоге готовый скрипт вставляется в игру и вуаля, у нас собственный интерфейс. ссылка на онлайн программу



    Введение

    Вот так, выглядит генератор и уже сделанный Hud интерфейс ... у них в пример брался ReinoRPGHud
    Спойлер 1:

    На этом рисунке, я подписал, что делает каждый из элементов
    тутор.jpg
    при нажатии EXPORT HUD (сохранение) он выдаст вам набор букв и чисел, это если по простому. Его стоит скопировать в блокнот. И в случае если нужно отредактировать ваш интерфейс, просто нажимаем Импорт и вставляем этот код туда.

    Делаем интерфейс:

    Создадим простейший интерфейс. И проведём некоторые настройки
    Первое, это просто добавлю прямоугольник(1. см. на картинке).
    пример 2.jpg
    Теперь добавлю текстовые окна (например имя героя, класс, количество золота и его уровень). Просто берем виджет и перетаскиваем на экран. После расставляем его как вам удобно. Это все можно делать мышью. После, раскроем дополнительные настройки текста. Там указывается размер текста, цвет, и всякие красотули. Но главное, это тип выдаваемого текста. Там есть список (первоначально стоит просто Text). Это просто текст, который вы введете. Другие же типы, относятся к определенным параметрам персонажа или местности или чего либо глобального (имя, класс, лвл). Скрипт устроен так, что он автоматически будет это все считывать!
    пример3.jpg
    Теперь добавлю изображения (например изображение чара, и красотульки над лвлом, классом и золотом из иконсета ). Иконки берутся из ид указанного в иконсете. Но можно и использовать к примеру, то что одето на персонаже, то и отображается. У таких при выборе из списка приставка ACTOR'S. Либо использовать ваши именные файлы графики (они будут браться из Graphics\Pictures).
    пример 4.jpg

    Вот что у меня получилось в итоге:
    итог.jpg

    Это код для вставки в игру
    Спойлер скрипт для игры:
    module HUDWidgets
    #----------
    class WidgetBase < Sprite
    def initialize(name, x, y, z)
    super()
    @name = name
    self.x, self.y, self.z = x, y, z
    end
    def z=(v)
    super(v + 60)
    end
    def z
    return super() - 60
    end
    end
    #----------
    class RectWidget < WidgetBase
    def initialize(name, x, y, z, w, h, color)
    super(name, x, y, z)
    @color = color
    bmp = Bitmap.new(w, h)
    bmp.fill_rect(bmp.rect, color)
    self.bitmap = bmp
    end
    end
    #----------
    class ImageWidget < WidgetBase
    attr_accessor :zoom_x, :zoom_y
    def initialize(name, x, y, z, w, h, a, param, text, idx)
    super(name, x, y, z)
    @iw, @ih = w, h
    self.opacity = a
    @param, @text, @idx = param, text, idx
    case @param
    when 1
    update_char
    when 3 .. 16
    self.bitmap = Cache.system('Iconset')
    self.src_rect = Rect.new(0, 0, 24, 24)
    update_icon
    end
    #-----
    @zoom_x_base = @iw.to_f / self.width
    @zoom_y_base = @ih.to_f / self.height
    self.zoom_x = 1.0
    self.zoom_y = 1.0
    end
    def zoom_x=(v)
    @zoom_x = v.to_f
    super(@zoom_x_base * @zoom_x)
    end
    def zoom_y=(v)
    @zoom_y = v.to_f
    super(@zoom_y_base * @zoom_y)
    end
    def update_char
    return unless @param == 1
    actor = $game_party.leader
    bmp = self.bitmap = Cache.character(actor.character_name)
    sign = actor.character_name[/^[!$]./]
    #-----
    if sign and sign.include?('$')
    cw, ch = bmp.width / 3, bmp.height / 4
    else
    cw, ch = bmp.width / 12, bmp.height / 8
    end
    n = actor.character_index
    self.src_rect = Rect.new((n%4*3+1)*cw, (n/4*4)*ch, cw, ch)
    self
    end
    def update_icon
    return unless @param >= 3
    actor = $game_party.leader
    i_idx = 0
    case @param
    when 4
    i_idx = ($data_weapons[@idx].icon_index rescue 0)
    when 9
    i_idx = ($data_skills[@idx].icon_index rescue 0)
    when 10
    i_idx = ($data_states[@idx].icon_index rescue 0)
    else
    i_idx = 0
    end
    self.src_rect = Rect.new(i_idx % 16 * 24, i_idx / 16 * 24, 24, 24)
    end
    end
    #----------
    class TextWidget < WidgetBase
    def initialize(name, x, y, z, param, text, id, fname, fsize, fbold, fitalic, fshadow, fcolor, foutline, foutline_color, tw, th, fix_from)
    super(name, x, y, z)
    #-----
    @fsize = fsize
    @fix_from = fix_from
    @initial_width = nil
    #-----
    @font = Font.new(fname, fsize)
    @font.bold = fbold
    @font.italic = fitalic
    @font.shadow = fshadow
    @font.outline = foutline
    @font.out_color = foutline_color
    @fbmp = Bitmap.new(1, 1)
    @fbmp.font = @font
    #-----
    @param, @text, @id = param, text, id
    @tw, @th = tw, th
    #-----
    r = @fbmp.text_size('Text')
    @font.size *= (@tw.to_f / r.width)
    #-----
    @fbmp.font = @font
    #-----
    self.oy = (((r.height * (@tw.to_f / r.width)) * (1.0 - (r.width / @tw.to_f))) * 0.5).ceil
    #-----
    update
    end
    def update
    actor = $game_party.leader
    case @param
    when 10 # LVL
    str = (@text % actor.level) rescue actor.level.to_s
    when 12 # Actor's Name
    str = (@text % actor.name) rescue ''
    when 13 # Actor's Class
    str = (@text % actor.class.name) rescue ''
    when 14 # Gold Amount
    str = (@text % $game_party.gold) rescue '0'
    else
    return
    end
    #-----
    self.bitmap.dispose if self.bitmap and not self.bitmap.disposed?
    return if str.empty?
    #-----
    r = @fbmp.text_size(str)
    bmp = self.bitmap = Bitmap.new(r.width + 32, r.height)
    bmp.font = @font
    bmp.draw_text(bmp.rect, str, 0)
    #-----
    @initial_width ||= self.width
    #-----
    case @fix_from
    when 0
    self.ox = 0
    when 1
    self.ox = (self.width - @initial_width) / 2
    when 2
    self.ox = self.width - @initial_width
    end
    end
    end
    end
    class Scene_Map < Scene_Base
    #----------
    alias :hud_alias_start :start
    alias :hud_alias_update :update
    alias :hud_alias_p_term :terminate
    #----------
    def start
    hud_alias_start
    start_hud
    end
    #-----
    def start_hud
    @actor_info_cache, @var_info_cache, @hud_widgets = {}, {}, {}
    @hud_widgets[5] = HUDWidgets::RectWidget.new('1 pryamougol', 167, 432, 0, 320, 48, Color.new(0, 0, 0, 159))
    @hud_widgets[6] = HUDWidgets::TextWidget.new('text Name', 209, 463, 1, 12, '%s', 0, 'Arial', 10, true, false, true, Color.new(255, 215, 0, 255), false, Color.new(0, 0, 0, 255), 24, 10,0)
    @hud_widgets[7] = HUDWidgets::TextWidget.new('text class', 240, 463, 2, 13, '%s', 0, 'Arial', 10, true, false, true, Color.new(0, 255, 127, 255), false, Color.new(0, 0, 0, 255), 24, 10,0)
    @hud_widgets[8] = HUDWidgets::TextWidget.new('text gold', 390, 460, 3, 14, '%d', 0, 'Arial', 15, true, false, true, Color.new(255, 215, 0, 255), false, Color.new(0, 0, 0, 255), 36, 15,0)
    @hud_widgets[9] = HUDWidgets::TextWidget.new('text level', 297, 457, 4, 10, '%d', 0, 'Arial', 18, true, false, true, Color.new(220, 20, 60, 255), false, Color.new(0, 0, 0, 255), 42, 18,0)
    @hud_widgets[10] = HUDWidgets::ImageWidget.new('image hero', 169, 440, 5, 32, 32, 255, 1, '', 0)
    @hud_widgets[11] = HUDWidgets::ImageWidget.new('image class', 257, 439, 6, 15, 15, 255, 4, '', 1)
    @hud_widgets[12] = HUDWidgets::ImageWidget.new('image lvl', 292, 433, 7, 24, 24, 255, 9, '', 1)
    @hud_widgets[13] = HUDWidgets::ImageWidget.new('image gold', 388, 431, 8, 24, 24, 255, 10, '', 1)
    update_hud
    end
    #----------
    def update
    hud_alias_update
    update_hud
    end
    #-----
    def update_hud
    actor = $game_party.leader
    if @actor_info_cache[:char_name] != actor.name
    @hud_widgets[6].update
    @actor_info_cache[:char_name] = actor.name
    end
    if @actor_info_cache[:char_class] != actor.class.name
    @hud_widgets[7].update
    @actor_info_cache[:char_class] = actor.class.name
    end
    if @actor_info_cache[arty_gold] != $game_party.gold
    @hud_widgets[8].update
    @actor_info_cache[arty_gold] = $game_party.gold
    end
    if @actor_info_cache[:char_level] != actor.level
    @hud_widgets[9].update
    @actor_info_cache[:char_level] = actor.level
    end
    if @actor_info_cache[:char_name] != actor.character_name or @actor_info_cache[:char_idx] != actor.character_index
    @hud_widgets[10].update_char
    @actor_info_cache[:char_name] = actor.character_name
    @actor_info_cache[:char_idx] = actor.character_index
    end
    end
    #----------
    def terminate
    hud_alias_p_term
    hud_dispose
    end
    #-----
    def hud_dispose
    @hud_widgets.each_value {|hw| hw.dispose }
    end
    #----------
    end


    код для сайта, чтобы импортировать и поглядеть мою демку :
    Спойлер код демки для импорта:
    eNrNlU9vmzAYh79KZGnSKqHJ/wDDbbftssM0acfIAQesmDgCkqat+t332jGU
    NZXqddJWJYeX18H4eWx+eUApKh/QTu9rVKLvqhp/6rpRI0rQXnYKemR16O9k
    Z4+NNdA9o5JkeYLuUMkZTdA9KnGCjK12CmbYSjOoBJ30oDcG7h 77I1ze6nps
    Ucko/LJVumlHuFmE/tro/Q6eg9E0uOxU1tge6r7ZyI848Z9PGc2xYCwjhAvB
    OL1BjwnKFhw/1PmKY4Te6purPQTFxQUiYx6CvAZxkL3snA8KE7jJoP4wQK3r
    sNat3bvm515LZ2rQ997fFQZN04SSFFDIDYxtrKmnh+hRGl3NSx haWdvbadAe
    RzCj5tFwvX7BkZ94q8/rbW+7sDxnxG0D5VB/CdtAMKjLY9RVRg5DcMfxb+5o
    tDv2t+5w4uwRmr8XdyLGXeOW6dWxYlKHvToWrY4v1NUR6tJ3du xYtlSXgroi
    Rp1RJxVyhxYhd9Lcu+PR7vAfuhNX7iC64Jv9J3ecLt0JcAdIT/K+drJRz+1p
    11y1qrdTaofA45eTl0an9lNouzoitKU5tBL2Cw7ctAdk3oCg37 07hMRBLKMn
    nf57Ck+RRVLAuZ8pXP02Cv6cgjgKGkdhTvM5poHhEp95JIMLn4 nB1W9jKF5k
    YHEMiyATIkAQDyH+KQTB1xSPvwBufZ/P

    ВНИМАНИЕ ЧТОБЫ ОТОБРАЗИЛОСЬ В ОКНЕ ПРЕД ПРОСМОТРА проделанная работа, просто измените разрешение проекта на любое другое, а потом верните обратно 640 на 480 как у меня. Не знаю с чем связана, эта досадная ошибка. (возможно проблема в браузере)


    p.s. Этот урок обобщенный. И предполагает, что у интересующегося человека, есть смекалка и маленькие знания англ. языка. Там интуитивно понятный интерфейс. Просто стоит немного с ним поиграться и посмотреть результат у себя в проекте. Всем удачи и ждем первых интерфейсов от наших соотечественников.

    зы2 Можно изучать как работает скрипт, добавляя, удаляя определенные виджеты. Использовать свои изображения, включая оснастку самого интерфейса как в рейнор худ. Добавлять шкалу здоровья, имя карты и так далее.
    Последний раз редактировалось Inca; 05.06.2013 в 14:23. Причина: префикс поставил

  2. #2
    Познающий Аватар для DeadElf79
    Информация о пользователе
    Регистрация
    09.08.2013
    Сообщений
    276
    Записей в дневнике
    12
    Репутация: 22 Добавить или отнять репутацию

    По умолчанию

    Работает только на ie? да и то криво, для показа настроек приходится извращаться с размером окна браузера, настройки самих "виджетов" скудны. Одно в нем хорошо - это наглядное полотно. Но это плохая программа ^_^

  3. #3
    Пользователь Аватар для Ром4ик
    Информация о пользователе
    Регистрация
    24.09.2014
    Сообщений
    55
    Репутация: 3 Добавить или отнять репутацию

    По умолчанию

    Он работает? У меня ничего не перетаскивается

  4. #4
    Хранитель Аватар для Paranoid
    Информация о пользователе
    Регистрация
    22.12.2014
    Сообщений
    2,776
    Записей в дневнике
    34
    Репутация: 28 Добавить или отнять репутацию

    По умолчанию

    Вообще не работает, ничего не перетаскивается.
    Лицензионный VX Ace. Спасибо Петр.
    2 года мукеризма в пустую.

  5. #5
    Администратор Аватар для Пётр
    Информация о пользователе
    Регистрация
    24.04.2014
    Адрес
    Краснодар
    Сообщений
    3,940
    Записей в дневнике
    6
    Репутация: 132 Добавить или отнять репутацию

    По умолчанию

    Ребят, ручки тренируйте. У меня все работает.

  6. #6
    Хранитель Аватар для Paranoid
    Информация о пользователе
    Регистрация
    22.12.2014
    Сообщений
    2,776
    Записей в дневнике
    34
    Репутация: 28 Добавить или отнять репутацию

    По умолчанию

    жмакаю, тяну на экран - ничего, тяну вниз - ничего

    UPD: пашет только в эксплорере, ущербный сайт
    Лицензионный VX Ace. Спасибо Петр.
    2 года мукеризма в пустую.

Информация о теме

Пользователи, просматривающие эту тему

Эту тему просматривают: 1 (пользователей: 0 , гостей: 1)

Социальные закладки

Социальные закладки

Ваши права

  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения
  •  
Урок HUD Designer