画面サイズに依存せずアイコンを配置する方法

このQ&Aのポイント
  • 画面サイズに依存せずアイコンを美しく配置する方法について解説します。
  • スマートフォン用のアプリ開発において、画面サイズに合わせてアイコンを配置する方法を調査しました。
  • JavaやC#を使用し、AndroidSDKやiPhoneSDKを使わずにアイコンの配置を調整する方法をご紹介します。
回答を見る
  • ベストアンサー

画面サイズに依存せずアイコンを配置する方法

スマートフォン用のアプリを開発しています 端末ごとに画面サイズが異なるため、背景画像を端末の横幅に合わせて拡縮するようにしています 背景画像の上にアイコン(20*20)を「縦に3 * 横に3」個配置したいのですが現在座標をピンポントに指定しているため画面サイズが変更された場合、左に寄ったり画面サイズに比べこじんまりしてしまったりしています(画面幅が640なのにアイコンどうしの間隔が5など) アイコンのサイズは変更せず、画面サイズに合わせてアイコンをきれいに配置する方法はありませんでしょうか(画面サイズが大きくなればアイコン同士の間隔が広がるような感じです) 言語はJavaかC#でお願いしたいのですが(アルゴリズムだけでも構いません)、AndroidSDKやiphoneSDK(?)の関数は使用しない方法でお願いします unityというソフトを使用しているため、それら特有の関数が一部使用できません 説明がかなりわかりにくいかもしれませんが、よろしくお願いします

質問者が選んだベストアンサー

  • ベストアンサー
回答No.2

>上記コードで実現できることを確認しました ん・・・。まあ、修正すれば実現できますが、イメージなのでコードは不正確です(^^;) >ここで一つ制約があるのですが、他のput(icon2)から他のアイコン(icon1やicon3)の設定後の座標を知ることができません >この状態で、すべてのアイコンを整列させる関数putはどのように作成すればよいでしょうか put(icon) は描画対象のアイコンを記憶する関数とします。 それとは別の関数で座標計算とアイコンの描画を行うこととします。 // icon は配列にする。 struct icon icon[9]; index = 0; void put(struct icon p) { icon[index++] = p; } void draw() { // 座標計算する // 画面サイズの高さ、幅を取得し3分割した高さと幅を求めセルのサイズとする。 cellWidth = screen.width / 3; cellHight = screen.hight / 3; // セル上のアイコンの lx, ly を求める。 iconPosX = cellWidth / 2 - 10; iconPoxY = cellHight / 2 - 10; // 行、列ごとの座標を求める for (row = 0; row < 3; row++) for (column = 0; column < 3; column++) { icon[row*3+column].lx = iconPosX + (cellWidth * column); icon[row*3+column].rx = icon[i].lx + 20; icon[row*3+column].ly = iconPoxY + (cellHight * row); icon[row*3+column].ry = icon[i].ly + 20; // [row, column](icon) // [0, 0](0) [0, 1](1) [0, 2](2) // [1, 0](3) [1, 1](4) [1, 2](5) // [2, 0](6) [2, 1](7) [2, 2](8) } // 描画する for (i = 0; i < 9; i++) unity.drawObject(icon[i]); }

その他の回答 (1)

回答No.1

イメージとしては下のようになると思います。 px = screen.width / 3; // 640/3=213.33333333333334 py = screen.hight / 3; for (i = 0; i < 3; i++) draw(px * i + 5, py * i + 5, icon); // 213 * 0 = 0 + 5 // 213 * 1 = 213 + 5 // 233 * 2 = 466 + 5 まあ、 API の詳細は unity のドキュメントを参照してください。

stepstop_2011
質問者

お礼

回答ありがとうございます 上記コードで実現できることを確認しました しかしunityを使用した場合ある制約上このコードは利用できませんでした 以下おおざっぱなイメージですが、 iconという画像の左上と右下のxとy座標をもつ構造体があるとします struct icon{ float lx = 0.0f; float ly = 0.0f; float rx = 0.0f; float ry = 0.0f; } この構造体のインスタンスを9個作成し、putという自作関数を通すことでアイコンが配置されるとします put(icon1); put(icon2); ~ 呼び元は上のような感じです ここで一つ制約があるのですが、他のput(icon2)から他のアイコン(icon1やicon3)の設定後の座標を知ることができません この状態で、すべてのアイコンを整列させる関数putはどのように作成すればよいでしょうか

関連するQ&A

  • windows10のアイコンフォントサイズに問題

    Windows カスタマイズフリーウェアアプリソフト「Winaero Tweaker」を使用していますが、アイコンサイズの間隔、フォントサイズを誤って変更してしまい、添付画像のようなサイズになってしまいました。 元に戻す方法について、対処法がございましたら教えていただけませんでしょうか? よろしくお願いいたします。 自分が使用しているOSは windows10 home 2004 h1 です。

  • デスクトップ画面、アイコンの配置が勝手に変わる

    日本HPのデスクトップPC(Elite Desk 800 G3 SF)、Win 7 で、最近頻繁に起こっている症状で困っています(何かの操作をして発生したものか記憶がありません)。パソコンの電源を入れた際のデスクトップ画面の表示ですが(スリープから元に戻した時にも起こることがある)、アイコンの配置は自分が使いやすいように配置し「アイコンを等間隔に整列」させているのですが、勝手に「アイコンの自動整列」させた状態に変わっています。その度に元の配置に並び変えていますが、頻繁に起こるので疲れてしまいます。 これらを防ぐにはどうしたら良いのでしょうか?、若しくは どのような設定(?)をしたら良いのでしょうか?. ※OKWAVEより補足:「NEC 121ware :デジタルライフ全般」についての質問です

  • アイコン位置の再現

    ディスクトップ画面で、画面サイズを変更すると、アイコンの配置が再配置されて変わってしまいます。 それは、画面サイズ変わることで仕方ないと思います。 再度、前の画面サイズに戻した時に、前のアイコン配置を簡単に復元できないものでしょうか。 一つ一つ、元の位置に再配置するのが面倒なのですが、可能でしょうか。

  • フォトショップからイラストレータに配置する場合の画像サイズの変更について

    過去の質問歴を読んでおおよそのことはわかったのですが、サイズについてなかったので、質問させてください。 フォト6イラレ10を使用しています。 フォトショップで画像を切り取り、背景を透明にして配置することは理解できました。その画像を、イラレで配置したとき大きな画像になっています。単純に考えて、縮小すればいいと思うのですが、DMなどで使いたいとき、はじめからそのサイズに変更して、配置することはできるのでしょうか? フォトショップで画像をいじってESPで保存してそれをイラレで開いて使ってましたが、縮小して解像数が低くなると印刷所から言われまして、どのようにしていいのか初歩的なことがわかっていないので、ご指導のほどよろしくお願いします。

  • 画像解像度とサイズと配置

    Painter Essentials4とPhotoshopCS4とillustratorCS4を使用しています。 Painter Essentials4で、キャンバスサイズ横1600ピクセル×縦1200ピクセル、 解像度350で、画像を作成しました。 その画像を同じキャンパスサイズのillustratorCS4に配置したら、 とても小さな画像になってしまいました。 同じサイズにするにはどうしたら良いでしょうか? また、キャンバスサイズ横1600ピクセル×縦1200ピクセル解像度350で、 Painter Essentials4やillustratorCS4で背景画像を作ったとします。 それを、PhotoshopCS4のキャンパスサイズ横600ピクセル×縦600ピクセル、 解像度350の所に配置すると、Photoshopで設定したキャンパスサイズに 合うように縮小されてしまいます。 これを、元のサイズで配置するにはどうしたら良いのでしょうか? 画像解像度の違いでサイズが変化するのは解ったのですが、 どうしたら元のサイズで配置出来るのでしょうか? Photoshopとillustratorのバージョン9を使用していた頃は こんなことはなかったのですが…。 よろしくお願いします。

  • 画面上のアイコンや文字などサイズが小さくなってしまいました。

    WindowsXPを使用しています。 PCを起動しましたら、 画面上に表示される何もかもが縮小されていました。 (数時間前に起動したときには買ったときのままの 通常サイズでした) 最初に画面に表示されるアイコンや 下のバーのところにあるアイコンも。。 それからインターネット上の画面やメールの画面も。。 アイコンや文字などすべてが小さくなっていたのですがどうやったら元に戻せるのでしょうか? とっても初心者なのでわかりやすく教えていただければ幸いです。 よろしくお願いします。

  • 画像拡縮について

    パソコンの壁紙のサイズを変更するフリーソフト『画像拡縮』を使って壁紙のサイズを変更して『デスクトップの背景として設定』とやったんですがほとんどサイズが変わってません何かミスをしているんでしょうか?

  • アイコンの間隔について

    画面のプロパティで大きいアイコンに設定してから元の小さなアイコンに戻したところ、なぜかアイコンの間隔だけが元に戻りませんでした。 画面のプロパティでアイコンの間隔(縦)(横)どちらとも見ましたがサイズは43で正常値でした。 デスクトップ以外のフォルダの中にあるファイルでは異常は見られず、デスクトップのアイコンだけが間隔がおかしく、大きいアイコンの時と同じくらい広がっていました。 そこで色々と試行錯誤し、一旦クラシックスタイルにしてみたところやっと間隔が直りました。(その後またいつものスタイルに戻しました。) 知識も無いのに運良く元に戻すことができましたが、デスクトップのアイコンの間隔だけがおかしくなってしまったのは一体何が原因だったのでしょうか。また大きいアイコンに設定するということは鬼門なのでしょうか? OSはWindows XP SP2を使用しています。 ↓一応参考画像です。 http://www8.uploader.jp/dl/sio/sio_uljp00018.png.html パス:1234

  • 画面のサイズ変更について(VC6.0)

    VC6.0を使用して画面サイズ15インチ(最大サイズ)で作成した画面が あります。 今度この画面サイズが17インチ(最大サイズ)に変更になります。 コントロールのサイズはそのまま(15インチで使用していた時のサイズ)という 指定がある事から、リサイズするしかないのかな。と考えています。 moveWindowを使用するとコントロールのサイズも変更になりますよね? やはり、リサイズ&コントロールの再配置を行うしか手段はないのでしょうか? ご存知の方、ご教示頂けると助かります。 それでは宜しくお願いします。

  • インラインフレームが画面サイズを変えるとずれてしまう

    メニューが書かれている画像をクリッカブルマップを使用して さらにその画像内にインラインフレームを表示させたいと思うのですが、 その画像の上にインラインフレームを乗せるとこまでは上手くいったのですが 解像度(画面サイズ)を変えて見たところ、 インラインフレームの位置がずれて表示されてしまいます。 元の画面サイズが1280x1024(綺麗に表示される)で、 変更後の画面サイズは1024x768(ずれて表示される)です。 どんな画面サイズからでもHPが見れるようにしたいのです。 ちなみに、クリッカブルマップを使用した画像の位置は どんな画面サイズになっても画面のど真ん中にくるようになっています。 インラインフレームだけがどうしてもずれてしまうのでお手上げです; どなたか詳しい方、教えていただけると助かります。 宜しくお願いします。

    • ベストアンサー
    • HTML

専門家に質問してみよう