Наведите и меню и кнопки

Question

Я хочу установить прямоугольник / слот, который при наведении на него создает небольшое окно, парящее со стороны прямоугольника / слота (немного перекрывающееся).

Я также хотел бы поместить несколько кнопок в маленькое меню. Мне бы хотелось, чтобы маленькое меню было длиннее (по ширине), чем исходный прямоугольник / слот, чтобы вместить много кнопок, что означает, что я не могу использовать slot.hover, потому что меню исчезает, если я перехожу из прямоугольник к кнопке, которая выключает прямоугольник... Любая помощь?

Answer 1

Вот пример, который должен показать вам логику, необходимую для достижения этой цели. Очевидно, это вышло бы из-под контроля, если бы у вас было несколько таких меню:

Shoes.app :title => "Test", :width => 1000, :height => 600 do
  @menu_hover = false
  @zone_hover = false
  @menu = nil
  @zone = stack :width => 200, :height => 100 do
    background '#DFA'
  end
  @zone.hover do
    @zone_hover = true
    app.append do
      break if not @menu.nil?
      @menu = stack :width => 230, :height => 35, :top => 50, :left => 150 do
        background '#F00'
        flow :margin => 5 do 
          button 'OK'
          button 'Cancel'
          button 'Ponies!'
        end
      end
      @menu.hover {@menu_hover = true}
      @menu.leave do
            @menu_hover = false
            break if @menu.nil? or @menu_hover or @zone_hover
            @menu.remove
            @menu = nil
      end
    end
  end

  @zone.leave do
    @zone_hover = false
    break if @menu.nil? or @menu_hover or @zone_hover
    @menu.remove
    @menu = nil
  end
end

Вот рифф на вышеупомянутом решении, который расширяет классы Shoes::Stack и Shoes::App, чтобы добавить hover? метод стеков (который, я думаю, они должны поддерживать по умолчанию). В вашем случае я бы подумал о создании собственного виджета вместо этого, но это показывает тип структуры, которую вы могли бы использовать.

class Shoes::Stack
  def hover?
    @hover ||= false
  end

  alias_method :default_hover, :hover
  alias_method :default_leave, :leave

  def hover(*args, &block)
    new_block = lambda { @hover = true; block.call }
    default_hover(*args, &new_block)
  end

  def leave(*args, &block)
    new_block = lambda { @hover = false; block.call }
    default_leave(*args, &new_block)
  end
end

class Shoes::App
  alias_method :default_stack, :stack
  def stack(*args, &block)
    s = default_stack(*args, &block)
    s.hover {}
    s.leave {}
    s
  end
end

Shoes.app :title => "Test", :width => 1000, :height => 600 do
  @menu = nil
  @zone = stack :width => 200, :height => 100 do
    background '#DFA'
  end
  @zone.hover do
    app.append do
      break if not @menu.nil?
      @menu = stack :width => 230, :height => 35, :top => 50, :left => 150 do
        background '#F00'
        flow :margin => 5 do 
          button 'OK'
          button 'Cancel'
          button 'Ponies!'
        end
      end
      @menu.leave do
            break if @menu.nil? or @menu.hover? or @zone.hover?
            @menu.remove
            @menu = nil
      end
    end
  end

  @zone.leave do
    break if @menu.nil? or @menu.hover? or @zone.hover?
    @menu.remove
    @menu = nil
  end
end

Answer 2

Похоже, вам нужно использовать некоторые дополнительные вещи, чтобы держать этот прямоугольник открытым и видимым как на кнопке, так и над слотом.

Это должно держать меню там, пока над чем-либо.