質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

Processing

Processingは、オープンソースプロジェクトによるCGのためのプログラミング言語です。Javaをベースにしており、グラフィック機能に特化しています。イメージの生成やアニメーションなど、視覚的なフィードバックを簡単に得ることが可能です。

Q&A

解決済

1回答

964閲覧

Processingでカーソルが図形に重なると色と音が変わるプログラムで、何も操作していない時も図形が表れるようにしたい

退会済みユーザー

退会済みユーザー

総合スコア0

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

Processing

Processingは、オープンソースプロジェクトによるCGのためのプログラミング言語です。Javaをベースにしており、グラフィック機能に特化しています。イメージの生成やアニメーションなど、視覚的なフィードバックを簡単に得ることが可能です。

0グッド

0クリップ

投稿2017/07/09 11:31

###前提・実現したいこと
Processingでカーソルが図形に重なると色と音が変わるプログラムで、何も操作していない時も図形が表れるように変更したいです。以下が、現状と変更後に実現したいことです。

現状
実現したいこと

###発生している問題・エラーメッセージ
何も操作していない時には、図形も背景色に隠れてしまって、どこにマウスを持っていけばいいか判断のつかないUIになっています。

###該当のソースコード

Processing

1import ddf.minim.*; 2import ddf.minim.signals.*; 3import ddf.minim.analysis.*; 4import ddf.minim.effects.*; 5 6ArrayList<MyShape> shapes = new ArrayList<MyShape>(); 7 8void setup() { 9 size(720, 720); 10 background(125); 11 frameRate(100); 12 13 //1を描画し、マウスが触れたら指定の色に変わる 14 MyShape ichi; 15 ichi = new MyRect(70, 140, 32, 200, #CE2828, "do.wav" ); 16 shapes.add(ichi); 17 18 //2を描画し、マウスが触れたら指定の色に変わる 19 MyShape ni; 20 ni = new MyRect(170, 150, 100, 32, #1318F0, "so.wav"); 21 shapes.add(ni); 22 ni = new MyRect(238, 182, 32, 43, #1318F0, "so.wav"); 23 shapes.add(ni); 24 ni = new MyRect(170, 225, 100, 32, #1318F0, "so.wav"); 25 ni.selectedFill = #1318F0; 26 shapes.add(ni); 27 ni = new MyRect(170, 257, 32, 43, #1318F0, "so.wav"); 28 shapes.add(ni); 29 ni = new MyRect(170, 300, 100, 32, #1318F0, "so.wav"); 30 shapes.add(ni); 31} 32 33void draw() { 34 rect (310, 310, 100, 100); 35 line(360, 0, 360, 720); 36 line(0, 360, 720, 360); 37 noStroke(); 38 39 background(102); 40 for (MyShape shape : shapes) { 41 if (shape.contains(mouseX, mouseY)) { 42 fill(shape.selectedFill); 43 if (shape.soundFile != null) { 44 Minim minim=new Minim(this); 45 AudioSample sample = minim.loadSample(shape.soundFile); 46 delay(1000); 47 sample.trigger(); 48 } else { 49 fill(255); 50 } 51 shape.draw(); 52 } 53 } 54} 55 56// 長方形を表すクラス 57class MyRect extends MyShape { 58 float x, y, w, h; 59 60 MyRect(float x, float y, float w, float h, int selectedFill, String soundFile) { 61 super(selectedFill, soundFile); 62 this.x = x; 63 this.y = y; 64 this.w = w; 65 this.h = h; 66 } 67 68 void draw() { 69 rect(x, y, w, h); 70 } 71 72 boolean contains(float mx, float my) { 73 return mx >= x && mx <= (x + w) && my >= y && my <= (y + h); 74 } 75} 76 77// 任意の図形を表す抽象クラス 78abstract class MyShape { 79 int selectedFill; 80 String soundFile; 81 82 MyShape() { // 何も指定しない場合は選択色が黒で、音のファイルは無し(=null)とする 83 this(#FFFFFF, null); 84 } 85 86 MyShape(int selectedFill, String soundFile) { 87 this.selectedFill = selectedFill; 88 this.soundFile = soundFile; 89 } 90 91 // 画面上へこの図形を描画するメソッド 92 abstract void draw(); 93 94 // 指定位置がこの図形に含まれるかどうか判定するメソッド 95 abstract boolean contains(float x, float y); 96}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

drawメソッドの中のif文の制御の流れに原因があります。

マウスがその図形(MyShape)に重なってない場合に、制御がどう流れるかを考えてみてください。その場合shape.draw()は実行されないのではないでしょうか?もしshape.draw()が実行されなければ図形が何も描画されないのでウィンドウには背景色以外に何も見えないことになりますよね?

java

1for (MyShape shape : shapes) { 2 if (shape.contains(mouseX, mouseY)) { 3***|fill(shape.selectedFill); 4 |if (shape.soundFile != null) { 5 | Minim minim=new Minim(this); 6 | AudioSample sample = minim.loadSample(shape.soundFile); 7 | delay(1000); 8 | sample.trigger(); 9 |} else { 10 | fill(255); 11 |} 12***|shape.draw(); 13 } 14}

このような制御の誤りを見つけやすいために、字下げを適切に行うこと、字下げの位置によって「どこがひとまとまりに処理科、どこで制御が分かれるか」を間違いなく把握することに慣れるとよいと思います。

上のコードには字下げを表す***|を書き加えてみました。これをみるとshape.drawはifの条件がtrueになったときにしか実行されないということにすぐに気づけます。大抵のプログラマーは「字下げのレベルを参考にすることで」制御の流れを最小限の手間で把握していきます。(ちょっと難しく感じたでしょうか・・・もしそうならスルーしてくださっても構いません。プログラミングに慣れてくれば自然とこういう感覚がわかるようになるはずだから)

どうなおせばよいかについては回答者さんご自身でよく考えてみてください。

投稿2017/07/09 12:04

KSwordOfHaste

総合スコア18392

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2017/07/10 01:11

ご回答ありがとうございます。可能であればもう少しヒントをいただきたいのですが、shape.draw()はこのコードないで位置を変更すればいいのか、それとも新たに仕組みを考えなければならないのかお聞きしたいです。 締め切りのあるもので、しっかり勉強したいのですが、時間が迫っており、少しでもヒントをいただけるとありがたいです。
KSwordOfHaste

2017/07/10 01:29

前者(このコードないで位置を変更すればいい)です。 if (条件) { 成立のとき } else { 不成立の時 } ということをよく考えてみてください。
退会済みユーザー

退会済みユーザー

2017/07/10 06:01

ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問