演習課題「画像を順番に出力する」
右側のエディターエリアのプログラムを元に、items_img配列を使用して、
1行づつHTMLで画像を表示してみましょう。
HTMLで画像を1行ずつ表示する場合は以下のようにimgタグを利用します。
<img src=URL><br>
期待する出力値
演習課題「アイテムリストを作ってみよう」
右側のエディターエリアのプログラムを元に、アイテムリストを作ってみましょう。
標準入力で出力するアイテム数と複数行のアイテム名の入力があります。
それを元に、items_imgで定義された画像を改行せず順番に出力してみましょう。
※標準入力で与えられるアイテム名は、items_imgに無いアイテムは
出てこないものとします。
期待する出力値
＃08:RPGのアイテム一覧を再現２
前回と今回のチャプターでは、ハッシュとループを使った具体例として、RPGのアイテム一覧を作成しています。このチャプターでは、実際にアイテムリストを実装していきます。
# 画像用ハッシュ
items_img = {
"剣" => "http://paiza.jp/learning/images/sword.png",
"盾" => "http://paiza.jp/learning/images/shield.png",
"回復薬" => "http://paiza.jp/learning/images/potion.png",
"クリスタル" => "http://paiza.jp/learning/images/crystal.png"
}
# アイテムの並び順配列
items_order = ["クリスタル", "盾", "剣", "回復薬", "回復薬", "回復薬"]
# 並び順の配列から各アイテム名を取り出す
items_order.each do |item_name|
puts item_name
end
# 画像ファイル名を取り出し、アイテム名を表示する
items_order.each do |item_name|
# 画像ファイル名を取り出す
puts items_img[item_name]
puts item_name
end
# 画像ファイル名を取り出し、imgタグで出力する
items_order.each do |item_name|
# src属性の値として出力する
puts "<img src = '#{items_img[item_name]}'>"
puts "#{item_name}<br>"
end
詳しくは、Ruby入門編3のチャプター8で解説しております。
https://paiza.jp/works/ruby/primerfemale/beginner-ruby3-female/3027# 標準入力とループ処理
count = gets.to_i
puts("データ個数 #{count}")
for i in 1..count
line = gets.chomp
puts "hello #{line}"
end