縦横比率を変えずに画像のサイズを変更する方法

前へ 次へ
このQ&Aのポイント
  • 縦横比率を変えずに画像のサイズを変更する方法について教えてください。
  • ユニクロドットコムのように高画質な写真をセンターに配置し、縦横の比率を保ちながらサイズを変更したいです。
  • 大きなサイズのディスプレイで見た人には背景を出し、小さいなサイズのディスプレイで見た人には全画面で表示する方法を教えてください。
回答を見る
  • ベストアンサー

縦横比率のを変えずに画像のサイズを変更したい

よろしくお願いいたします。 ■環境 MAC OS 10.4.9 Flash 8 Pro ActionScript 2.0 フルスクリーンのフルフラッシュ ユニクロドットコムの様に高画質な写真をセンターに配置したいです。 その際に写真の縦横の比率は変えずに、 縦は常にブラウザの上下と同じサイズで、 大きなサイズのディスプレイで見た人には左右に背景を出し、 小さいなサイズのディスプレイで見た人には全画面で見える。 という風にしたくて色々と試行錯誤しておりますが、上手くいきません。 まさに目指す見え方がユニクロドットコムのトップページなのですが、やはり中村勇吾さんのようにはいきません・・・。 どなたかご掲示いただけませんか。 よろしくお願いいたします。m(_ _)m

  • Flash
  • 回答数2
  • ありがとう数4

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

  • ベストアンサー
noname#35109
noname#35109
回答No.1

書かれているご質問の文章と， ユニクロドットコムのページは全然違うように思いますが， 本当にこちらのページ↓で合っていますか？ 「Uniqlo.com」 http://www.uniqlo.com/jp/ > 写真の縦横の比率は変えずに、 > 縦は常にブラウザの上下と同じサイズで、 ぜんぜんそのようにはなっていませんが... 確かに，写真の縦横の比率は変わりませんが， そうではなくて， 横がは常にブラウザの横幅サイズに影響されています。 また， > 大きなサイズのディスプレイで見た人には左右に背景を出し、 ユニクロの場合は， 大きなサイズのディスプレイでも，小さなサイズのディスプレイでも， 常にメニューのようなものが表示されていますよ。 ぜんぜんちがう内容のことを２つ書かれても， どう回答して良いのか迷ってしましますが......。 また，これも意味がわかりません↓。 > 大きなサイズのディスプレイで見た人には左右に背景を出し、 > 小さいなサイズのディスプレイで見た人には全画面で見える。 左右に背景が見えたり見えなかったりするのは， 大きなサイズのディスプレイとか， 小さいなサイズのディスプレイとかいう問題ではなく， 単ウィンドウの縦横比で左右に背景が見えたり見えなかったりさせるのではないでしょうか？ 書いている内容自体も矛盾していますね。 Flash の作成に取りかかる以前に， 「何をどうしたいのか」を具体的にしっかりイメージしましょう。 そうしないと，できないと思います。 ======================================= 違うことや矛盾することが多く謎だらけですから， 次の部分についてのみ，作成サンプルを回答します。 > 写真をセンターに配置したいです。 > その際に写真の縦横の比率は変えずに、 > 縦は常にブラウザの上下と同じサイズで、 まず，Flash で 新規ドキュメント を作成してください。 作成したら，「ファイル」→「パブリッシュ設定」で，HTML タブ を選択し， 　サイズ(D): [ムービーに合わせる　　]▼ の部分を， 　サイズ(D): [パーセント　　　　　　　]▼ 　幅(W) :　　　　　高さ(E) : 　[100　　　] ×　[100　　　] パーセント にして「OK」をクリック。100％の設定にしておきます。 そして， ステージ上に 「縦に長めの塗りの長方形」 を描いてください。 これは写真に見たてている物で，写真でもかまいませんが， 長方形の塗りを描くだけでも十分サンプルにはなります。 大きさは適当でかまいません。 横幅150px，高さ200pxくらいの大きさで良いと思います。 その 「縦に長めの塗りの長方形」 を全部選択して， 「修正」→「シンボルに変換」で ムービークリップ に変換するわけですが， 変換する際の「基準点」に注意してください。 実際にはどこを基準点としても良いのですが， 座標計算の都合上，この回答では， 上の中央↓にしておいたということにします。 　基準点(R) □■□ 　　　　　　　　□□□ 　　　　　　　　□□□ 基準点が上の中央の「縦に長めの塗りの長方形」ムービークリップができましたら， そのムービークリップにインスタンス名を付けます。 この説明では 「my_mc」 というインスタンス名を付けたとしておきます。 そして， レイヤーを１つ追加して，ActionScript 専用レイヤーにします。 その新しいレイヤーの空白キーフレームを選択して， 次のスクリプトを書き（コピペし）， SWF と HTML をパブリッシュすればサンプルの完成です。 ------------------------------------- // ステージ上のオブジェクトの拡大縮小なし Stage.scaleMode = "noscale"; // ムービーを左上に配置 Stage.align = "TL"; // //ムービークリップの縦横比を算出 mc_w = _root.my_mc._width/_root.my_mc._height; // // リスナー用オブジェクトの作成 myListener = new Object(); // ステージ拡大縮小時の onResize を動作定義 myListener.onResize = function() { //ムービークリップを中央に表示 _root.my_mc._x = Stage.width/2; _root.my_mc._y = 0; //ステージの高さによってムービークリップの大きさを変える _root.my_mc._height = Stage.height; _root.my_mc._width = mc_w*_root.my_mc._height; }; // 上記 onResize の動作を初回実行 myListener.onResize(); // // ステージクラスにリスナー用オブジェクトを登録 Stage.addListener(myListener); ------------------------------------- Stage.scaleMode = "noscale"; これで，ムービーの中身の大きさをウィンドウの大きさによって変化させないようにしておいて， Stage.align = "TL"; これで，基準となる座標位置を左上と決定しておきます。 あとは，ステージのサイズを監視するリスナーオブジェクトを作って， ステージのサイズが変わるたびに， 各ムービークリップ（上記の場合１つのムービークリップ）の座標や大きさを， スクリプトによって随時更新させるということです。 それだけのことと言えば，それだけのことです。 あと，Flash ではなく，HTMLの話ですが， Flash の周りの余白が気になるようでしたら， パブリッシュされた HTML の <body>タグ， <body bgcolor="#ffffff"> などとなっている部分を， <body bgcolor="#ffffff" leftmargin="0" topmargin="0"> などのように変更すれば隙間はなくなると思います。 ======================================= その他の点につきましては， どういうことをしたいのかがわかりませんから，書けません。 上に書いたことや，次のURL群を参考にしてみてください。 Flashの表示サイズを動的に変更させる方法 http://oshiete1.goo.ne.jp/qa2479358.html 　↑教えて！goo　↓OKWave（同じです） http://okwave.jp/qa2479358.html 「画面サイズが変わると移動するスクリプト」 http://oshiete1.goo.ne.jp/qa2326170.html 　↑教えて！goo　↓OKWave（同じです） http://okwave.jp/qa2326170.html Flashゲーム講座＆ASサンプル集 【表示に関する情報について】 http://hakuhin.hp.infoseek.co.jp/main/as/stage.html 　

takasi123
質問者

お礼

至らぬ質問への回答、本当にありがとうございます。 まさに、sassakunさんが回答してくださったことがやりたかったのです。教えていただいたスクリプトを元にいろいろ実験してみました。 MCのサイズの縦のみをブラウザのサイズに依存させれるならと思い、自分なりに改造してMCのサイズの横のみをブラウザのサイズに依存させる実験をしてみました。 　基準点(R) □□□ 　　　　　■□□ 　　　　　□□□ ======================================= // ステージ上のオブジェクトの拡大縮小なし Stage.scaleMode = "noscale"; // ムービーを左上に配置 Stage.align = "TL"; // //ムービークリップの縦横比を算出 mc_w = _root.my_mc._height/_root.my_mc._width; // // リスナー用オブジェクトの作成 myListener = new Object(); // ステージ拡大縮小時の onResize を動作定義 myListener.onResize = function() { //ムービークリップを中央に表示 _root.my_mc._x = 0; _root.my_mc._y = Stage.height/2; //ステージの高さによってムービークリップの大きさを変える _root.my_mc._height = mc_w*_root.my_mc._width; _root.my_mc._width = Stage.width; }; // 上記 onResize の動作を初回実行 myListener.onResize(); // // ステージクラスにリスナー用オブジェクトを登録 Stage.addListener(myListener); ======================================= が、この方法ですとバブリッシュ後は形が狂ってしまいます。 自分でウィンドウを動かすと形が正常に戻り、求めていた動きをするのです。 ちょっと自分には早すぎたのかもしれません。 もし、お時間ありましたらどこの考え方が間違っているのか教えていただけませんか？ よろしくお願いいたします。 m(_ _)m

その他の回答 (1)

noname#35109
noname#35109
回答No.2

＃１です。 「縦と横のどちらを基準に，もう片方を決めているのでしょうか？」 ということを考えるとどこが間違っているのかわかると思いますよ。 ＃１の補足で書かれている不正解部分↓ //ステージの高さによってムービークリップの大きさを変える _root.my_mc._height = mc_w*_root.my_mc._width; _root.my_mc._width = Stage.width; 正解↓ //ステージの高さによってムービークリップの大きさを変える _root.my_mc._width = Stage.width; _root.my_mc._height = mc_w*_root.my_mc._width; 横を基準に大きさを変化させて， その横幅を基準に高さを決定するのですから， 順序が逆ですね。 ではなぜ， > 自分でウィンドウを動かすと形が正常に戻り、 > 求めていた動きをするのです。 という現象が起きるのかというと， 実は，「形が正常に戻り」状態ではないのです。 前の段階の横幅を基準に高さが決まっただけなのです。 ですから，ワンテンポずれています。 ウィンドウの形を動かし続けると， 繰り返し，myListener.onResize が実行されます。 このときの高さはほんの少し前の横幅を基準にするため， ほとんど誤差は無いに等しいですが， 厳密には前の瞬間の横幅によって高さが決定されるので， ほんのワンテンポずつ遅れて高さが決まっています。 ですから， 毎回少しずつ誤差があるので，本当は「形が正常に戻り」状態にはなっていないのです。 そういう感じで， １つずつ（１行ずつ）ちゃんと考えて行くと， たいていの場合，自分で組みたてた理論通りに動くと思いますよ。 　

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. Flash

関連するQ&A

  • モニタの縦横比率

    ノートです。 1280×1024がネットするのにちょうどいいのでそれで作業していたところ、1024×768に戻してみたところ縦横比率のズレがひどく、作った画像などが全て縦伸びしておりました。印刷して確かめると、1280×1024で作ったほうが間違っていることがわかりました。 詳細設定からパネルサイズに合わせる、に設定すると上下左右に黒の余白ができ、操作、表示できる画面自体が小さくなってしまっていて見づらいです。 1600×1200にすると余白はなくなり、これがこの液晶画面の標準の解像度だとは解るのですが、画像など、小さくなってしまって見づらいです。 1280×1024で表示しても縦横比率が正しく表示できるようにするには方法はありますでしょうか？

  • デジタル一眼レフでの写真の、縦横の比率について

    ニコンのD5000のデジタル一眼レフを使っています。 今まで現像したことがなく、今回初めて現像しようと思い写真加工していました。 画面上で「大体Lサイズの仕上がりはこのくらいの大きさかな?」と試しにプレビューで縮小して出来上がりの雰囲気を確認したところ、一般的なLサイズの写真と縦横の比率が違うことに気付きました。 (一眼レフで撮った写真は、若干横が長いのです) そこでいくつか質問があります。 (1)このまま現像してしまったら、横が印刷されないのですよね? そういった場合は全部正しい比率にトリミングしてから現像に出すのが一般的なのでしょうか。 (2)また縦横の比率が違ってしまうのは私の一眼レフが原因なのでしょうか。 他の一眼レフユーザーの方でも、同じように比率の違いがあったりするのでしょうか。 どうぞ宜しくお願いします。

  • 官製はがきのプリントサイズは縦横、何ピクセル？

    ８Ｍと５Ｍのデータサイズで撮ったデジカメ写真が有ります。 リサイズしてちょうど官製はがきのサイズにどんぴしゃになる大きさにしたいのですが、 縦横、各何ピクセルに設定すれば良いですか？また、そうした場合、縦横の比率が崩れますか？ 宜しくお願いします。

  • デジタルカメラと画像比率

    最近のデジタルカメラの高画質の場合は1712 * 1368(比1.25145)で 昔の640*480(比1.333)と比率が異なって扱いにくいです。 間違っているかもしれませんが、理想は1.5の比率が良いなど聞いたり しますので、どの比率で写真を撮ればよいか困っています。 大量に写真をとりますので、後で困らないように使いまわしのできる 比率のサイズでデータを残したいのですが、皆さんはどのような 比率で保存しているのでしょうか？ 後でソフトで変換すると実物と形が変わる場合があるので、 できれば、よく使われる写真比率が知りたいです。 用途は、WEBなどです。 最近の高画質に限って比率がばらばらで、発展途上なのでしょうか？

  • 写真編集後の縦横比とプリントサイズ

    写真編集後の縦横比とプリントサイズ 先ほど以下の質問をしたものです。 http://okwave.jp/qa/q6078151.html サイズはそのままで写真を上下に連結して、６０００×４０００サイズの画像ができあがりました。 もともとはデジカメの写真で縦横比が４：３だったのですが、編集後３：２（２：３？）になっていますよね…？ この場合、注文するのはL判とDSC、どちらがベストでしょうか。 おそらくL判ではないかと思いますが、如何でしょうか？ また、縦長と横長はプリント注文する際にどちらでも差し支えありませんか？

  • 写真の比率について

    今、canon eos kiss x2 を使っています。 写真のプリントについての質問のなのですが、例えばA1サイズにプリントしようとするとき、写真データをそのA1サイズに合わせようとすると写真の比率を変えざるを得ないですよね？？ これからA1サイズのプリントをしようかと考えているんですが、写真の比率を無理矢理変えてA1サイズにするか、 または、写真の比率は変えずにA1サイズに合わせて余った分は余白として残しておく or カッター等でカットするのか？？ みなさん、どのようにしているのでしょうか？？ 以前、6切りワイドのプリントを店に出した時（カメラで撮った画像はそのままの状態で、phtoshop等でトリミングや画像に手は加えていない）は、できあがると写真が勝手にトリミングされていました。 このようにカメラで撮ったそのままのデータを出して、勝手にトリミングされないようにするには、どのようにすればよいのでしょうか？？ L版サイズだとそんなことにはならないのでしょうか？？ 私は、イラストレーターでA1サイズの用紙設定をして、その枠に合うように画像の比率を変えずに配置し、最後にPDFに書き出す。 という風にやってみましたが、こういうやり方っておかしいですか。。 なにか良い方法があればアドバイスくださいませ。 よろしくお願い致します。

  • トリミングしてプリントする際の比率

    デジカメで撮った写真をLサイズにプリントすると、上下が切れてしまいます。この写真をトリミングして、モニタで見ている画像と同じように印刷したいのですが、比率はどのようにトリミングすれば良いのか教えて下さい。 （↓検索してみたのですが、良く分かりませんでした・・・。違っているかも知れません。） ・デジカメの撮影比率は３：４で、一般的な写真（Lサイズなど）の比率は２：３だと書いてあったのですが、トリミング時に２：３の比率になるよう切り抜けば良いのでしょうか？ ・Lサイズの他に、ハガキサイズ,２L,４切りサイズでプリントする時も比率が２：３になるようトリミングすれば良いのでしょうか？ ・使用しているソフトにDPIという設定項目があり、標準で300DPIとなっています。写真のプリントではどのくらいにしておけば良いでしょうか？ 素人ですので、易しく教えて頂けると嬉しいです。宜しくお願いします。

  • デジタル一眼の画面の比率

    デジタル一眼レフカメラの購入を考えています。 そこでお伺いしたいのですが、 デジタルカメラで撮影した時、データとして記録される写真の 縦横のサイズの比率って３５ｍｍフィルム（もしくはＬ判？）と同じ比率なのでしょうか？ 後々ソフトなどを使ってトリミングなどせずに できれば中判の比率で撮影がしたいのですが・・・・ 撮影画面の比率を変えるようなモードはありますか？ ご存知の方がいらっしゃいましたら教えていただきたいのですが・・・・

  • RDF22Sで、縦横比が崩れてしまいます

    三菱のRDF22Sなんですが、ディスプレイのサイズは4：3で、1600×1200にしています。 画面のプロパティで解像度を設定し、1600×1200に画面が切り替わった後に、 イラストレーターなどで正方形を描いて、それを実際に定規で測って縦横比をあわせると、横幅が左右10mmずつぐらい黒帯になります。 メーカーHPによるとディスプレイの範囲は412×311mmで、4：3比率でみると若干横長ですが、それでも1mm程度です。 左右10mmも短いと(412-20)：311で、3.78:3ぐらいの比率になってしまいます。 つまり1600×1200の4：3比率だと、正方形がかなり横長になってしまうのですが、改善方法などあるんでしょうか？

  • デジカメサイズとL判の縦横比の違いについて

    デジカメで撮影した画像の縦横比とL判の縦横比は違いますよね。 L判でプリントすると、上下が切れてしまいます。 私は被写体をギリギリまで撮ったり、風景でもデジカメで撮ったサイズ 通りにプリントしたいのですが、デジカメサイズの用紙って売ってないですよね？ なので現在はネットでDSCサイズで注文しています。 せっかくデジカメがプリントできるプリンタもあるのに（キヤノン MP500）、 なぜDSCサイズのプリント用紙は流通していないのでしょうか。 というか、この縦横比の違いに不満がある人はいないのでしょうか （少なくとも私は聞いたことがありません）。 一般的には多少上下が切れてもあまり問題視しないのでしょうか。 ずっと昔からとても不思議に思っています。 みなさんはどう思われますでしょうか。 それとも私の知識不足でしょうか。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する