tips_img_020 - spoolkitamura/nyle-doc-jp GitHub Wiki

画像の表示位置を指定するには?

画像の表示には draw_imageメソッドを使いますが、その際に x, yの基点座標の指定に加えて
オプション posによって「画像の左上」を基点座標とするか「画像の中心」を基点座標とするかを
指定することができます。

[関連情報]
draw_image

 

  • 画像を表示する(画像の左上を基点座標; デフォルト)
require 'nyle'

class Screen < Nyle::Screen
  def initialize
    super(200, 300, {bgcolor: :IVORY})
    @image = Nyle.load_image("./j1.png", {color_key: :WHITE})
    @x =  45
    @y = 120
  end
  def draw
    Nyle.draw_image(@x, @y, @image)   # 画像の左上を基点座標として表示
    Nyle.draw_rect(@x, @y, @image.width, @image.height, {color: :RED, weight: 1})
    Nyle.draw_circle(@x, @y, 3, {color: :RED, fill: true})
    Nyle.draw_text( 50, 110, ":CORNER", {size: 18, color: :RED})
  end
end

Screen.new.show_all
Nyle.main

[実行結果]


  • 画像を表示する(画像の中心を基点座標)
require 'nyle'

class Screen < Nyle::Screen
  def initialize
    super(200, 300, {bgcolor: :IVORY})
    @image = Nyle.load_image("./j1.png", {color_key: :WHITE})
    @x =  45
    @y = 120
  end
  def draw
    Nyle.draw_image(@x, @y, @image, {pos: :CENTER})   # 画像の中心を基点座標として表示
    Nyle.draw_rect(@x - @image.width / 2, @y - @image.height / 2, @image.width, @image.height, {color: :RED, weight: 1})
    Nyle.draw_circle(@x, @y, 3, {color: :RED, fill: true})
    Nyle.draw_text( 95, 125, ":CENTER", {size: 18, color: :RED})
  end
end

Screen.new.show_all
Nyle.main

[実行結果]