一次界面脚本结构优化的经历

KB.Driver · 发表于 2019-3-3 23:03:24

加入我们，或者，欢迎回来。

您需要登录才可以下载或查看，没有帐号？注册会员

x

初学ruby时，用自己蹩脚的编程水平写了一个标题界面。

当然，代码的结构十分的“个性”，不利于阅读与修改，更不用说拓展了。
随便找出一段代码都能让人看着头大

旧代码

最近着手重构这部分代码.

优化过程

好了，这样可读性大幅度提高了，并且还有机会扩展。

新代码

最终效果

shitake · 发表于 2019-3-4 00:12:53

本帖最后由 shitake 于 2019-3-4 02:10 编辑

为什么不来试试 rgui 呢【逃

github.com/molingyu/rgui

https://molingyu.github.io/rgui/

rgui

上边界面的等价物没测试感觉是跑不起来 orz

RUBY 代码复制

# require 'rgui'
 
class View_Title
    include RGUI
    def initialize
        @childs = []
        @bg = Component::ImageBox.new({
            image: Bitmap.new('bg.png'),
            x: 0,
            y: 0,
            width: Graphics.width,
            height: Graphics.height,
            type: Component::ImageBoxType::Filling
        })
        @childs.push @bg
        @button_bg =  Component::ImageBox.new({
            image: Bitmap.new(Graphics.width, 48).fill(0, 0, Graphics.width, 48, Color.new(255, 255, 255, 180)),
            type: Component::ImageBoxType::Responsive,
            visible: false
        })
        @button_bg.add_action(:breath, {speed: 0.6})
        @childs.push @button_bg
        @command_index = 0
    end
 
    def create_command(name, method, enabled = false)
        button = Component::SpriteButton.new({
            x: 0,
            y: 300 + @command_index * 48,
            status: enabled,
            images: create_button_bitmap(conf.name)
        })
 
        button.on(:click){ |_| method.call }
 
        button.on(:mouse_out){ |em| em.object.lost_focus }
 
        button.on(:lost_focus) { |em|
            em.object.sprite.zoom_y = 1
            index = @childs.index(em.object)
            while(@childs[index + 1].class == Component::SpriteButton)
                @childs[index + 1].y = @childs[index].y + @childs[index].height
                index += 1
            end
            @button_bg.hide
        }
 
        button.on(:mouse_in){ |em| 
            Event::EventManager.focus_object.lost_focus if Event::EventManager.focus_object != em.object
            Event::EventManager.focus_object == em.object
            em.object.get_focus
        }
 
        button.on(:get_focus){ |em|
            em.object.sprite.zoom_y = 1.5
            index = @childs.index(em.object)
            while(@childs[index + 1].class == Component::SpriteButton)
                @childs[index + 1].y = @childs[index].y + @childs[index].height * 1.5
                index += 1
            end
            @button_bg.y = em.object.y
            @button_bg.show
        }
        @childs.push(button)
        @command_index += 1
    end
 
    def create_button_bitmap(name)
        font = Font.new("LilyUPC", 32)
        font.bold = true
        font.out_color = Color::BLACK
        [Color::GL18, Color::GL32, Color::GL4].map{|c| 
            bitmap = Bitmap.new(Graphics.width, 32)
            bitmap.font = font
            bitmap.font.color = c
            bitmap.draw_text(0, 0, Graphics.width, 32, name, 1)
            bitmap
         }
    end
 
    def update
        @childs.each{|c| c.update }
    end
 
    def dispose
        @childs.each{|c| c.dispose }
    end
 
end
 
class Scene_Title < Scene_Base
    def start
        @view = View_Title.new
        @view.create_command 'New Game', method :new_game
        @view.create_command 'Load Game', method(:continue), DataManager.save_file_exists?
        @view.create_command 'Shutdown', method :shutdown
    end
 
    def update
        @view.update
    end
 
    def new_game
    end
 
    def continue
    end
 
    def shutdown
    end
end

# require 'rgui'


 


class View_Title


    include RGUI


    def initialize


        @childs = []


        @bg = Component::ImageBox.new({


            image: Bitmap.new('bg.png'),


            x: 0,


            y: 0,


            width: Graphics.width,


            height: Graphics.height,


            type: Component::ImageBoxType::Filling


        })


        @childs.push @bg


        @button_bg =  Component::ImageBox.new({


            image: Bitmap.new(Graphics.width, 48).fill(0, 0, Graphics.width, 48, Color.new(255, 255, 255, 180)),


            type: Component::ImageBoxType::Responsive,


            visible: false


        })


        @button_bg.add_action(:breath, {speed: 0.6})


        @childs.push @button_bg


        @command_index = 0


    end


 


    def create_command(name, method, enabled = false)


        button = Component::SpriteButton.new({


            x: 0,


            y: 300 + @command_index * 48,


            status: enabled,


            images: create_button_bitmap(conf.name)


        })


 


        button.on(:click){ |_| method.call }


 


        button.on(:mouse_out){ |em| em.object.lost_focus }


 


        button.on(:lost_focus) { |em|


            em.object.sprite.zoom_y = 1


            index = @childs.index(em.object)


            while(@childs[index + 1].class == Component::SpriteButton)


                @childs[index + 1].y = @childs[index].y + @childs[index].height


                index += 1


            end


            @button_bg.hide


        }


 


        button.on(:mouse_in){ |em| 


            Event::EventManager.focus_object.lost_focus if Event::EventManager.focus_object != em.object


            Event::EventManager.focus_object == em.object


            em.object.get_focus


        }


 


        button.on(:get_focus){ |em|


            em.object.sprite.zoom_y = 1.5


            index = @childs.index(em.object)


            while(@childs[index + 1].class == Component::SpriteButton)


                @childs[index + 1].y = @childs[index].y + @childs[index].height * 1.5


                index += 1


            end


            @button_bg.y = em.object.y


            @button_bg.show


        }


        @childs.push(button)


        @command_index += 1


    end


 


    def create_button_bitmap(name)


        font = Font.new("LilyUPC", 32)


        font.bold = true


        font.out_color = Color::BLACK


        [Color::GL18, Color::GL32, Color::GL4].map{|c| 


            bitmap = Bitmap.new(Graphics.width, 32)


            bitmap.font = font


            bitmap.font.color = c


            bitmap.draw_text(0, 0, Graphics.width, 32, name, 1)


            bitmap


         }


    end


 


    def update


        @childs.each{|c| c.update }


    end


 


    def dispose


        @childs.each{|c| c.dispose }


    end


 


end


 


class Scene_Title < Scene_Base


    def start


        @view = View_Title.new


        @view.create_command 'New Game', method :new_game


        @view.create_command 'Load Game', method(:continue), DataManager.save_file_exists?


        @view.create_command 'Shutdown', method :shutdown


    end


 


    def update


        @view.update


    end


 


    def new_game


    end


 


    def continue


    end


 


    def shutdown


    end


end

KB.Driver · 发表于 2019-3-4 00:57:58

shitake 发表于 2019-3-4 00:12
为什么不来试试 rgui 呢【逃

github.com/molingyu/rgui

这个太触了，回头都可以用rm写简单的窗体程序了……

我还只是做着玩玩，用不到这么高端的东西233
（咱不是搞编程的，只会瞎摸几下rgss，涉及到线程和API就不会了_(:з」∠)_

帐号		自动登录	找回密码
密码			注册会员

[讨论] 一次界面脚本结构优化的经历

加入我们，或者，欢迎回来。

R考场第七期纪念奖

开拓者