プログラミング演習３第４回ミニプロジェクトミニプロジェクトについて • １週目では丸や三角形などの形状を用いて継承の復習、２週目ではボタンなどのレイアウトや図形の描画などGUIの復習をしました • ミニプロジェクトでは、これら２つを組み合わせておえかきツールを作ってみましょう完成図の例図形選択パネルメニュー描画パネル 1) ボタンを選択 -> 選択された図形の描画準備 2) 描画パネルをクリック -> 選択された図形をクリックされた座標に描画ミニプロジェクトの流れ • • • • 基本図形クラスの設計お絵かきツールの作成複合図形クラスの設計発展実装の過程 Step1 Step2 Step3 • Circleクラスを参考にして四角形や三角形などの基本図形クラスを作る • お絵かきツールを作成し、メニューバー、描画パネルと図形選択パネルを配置する • 図形選択パネルにStep1で作成した図形の画像を貼り付けたボタンを表示する • 図形選択パネルのボタンを選んで、描画パネル上でクリックすると、クリックした場所に図形が描画さ Step4 れる Step5 • 複合図形クラスに共通するメソッドをまとめたCompoundDrawableを定義し、Treeクラスを描画する • TreeクラスのようなCompoundDrawableを実装するクラスをメンバーに持つ複合図形クラスを３個以上作る目標 • CompoundFigureクラスを定義し、複合図形クラスに共通する処理をまとめ、Step5で作ったクラスの発展1 Superクラスとする発展2 • おえかきツールにオリジナルの機能を追加する（Undoとかキャプチャとか）複合図形クラスの定義基本図形クラスとの違い複合的基本的 Drawable 継承 CompoundDrawable 共通なメソッドと特有なメソッドを分け、それぞれのインターフェースにまとめる draw(int x, int y, Graphics g) drawfill(int x, int y, Graphics g) setColor(Color c) getColor() setFilled(Boolean b) getFilled() getImage() getWidth() getHeight() getParts() setDefaultColor() CompoundDrawable Treeクラスの指針 • 課題1で設計したTreeクラスに描画処理を実装する • 基本図形と共通のメソッドはP. 9 - 11のBigCircleの実装例を参考する • 複合図形はパーツ毎に色が異なるため、drawメソッドではデフォルトカラーを指定するsetDefaultColorメソッドを呼ぶ必要がある drawメソッド drawfillメソッド drawメソッド drawfillメソッド Tree クラスの実装例 (1/2) Tree クラスの実装例 (2/2) 発展複合図形クラスをもっと簡潔に複合的な図形でも共通の処理を抽象クラスにまとめると便利継承継承他の複合的な形状のクラス Lesson03のスライド7を参考にするとよいスクロールバーをつける表示するものが大きすぎてフレームやパネルに収まり切らない場合はスクロールバーをつけると便利です ALWAYSに指定したためフレームに収まっていてもスクロールバーが出るバーを出す条件 AS_NEEDEDと指定し、フレームに収まらなかったためスクロールバーが出たファイルの読込みファイルを読み込んでキャンバスに張り付けたり、作品を画像ファイルとして保存するユーザに開くファイルを選んで貰う場合はFileDialogを使うユーザがファイルを選択した場合、ファイルまでのパスとファイル名を取得できるが、画像として読み込むのか、中のテキストを読み込むのかは自分で実装する必要があるその他 • • • • Ctrl+ZでUndo機能をつける getPartsメソッドを活かした描画の実現図形を拡大・縮小して描画描画前にプレビューなど実装の過程 Step1 Step2 Step3 • Circleクラスを参考にして四角形や三角形などの基本図形クラスを作る • お絵かきツールを作成し、メニューバー、描画パネルと図形選択パネルを配置する • 図形選択パネルにStep1で作成した図形の画像を貼り付けたボタンを表示する • 図形選択パネルのボタンを選んで、描画パネル上でクリックすると、クリックした場所に図形が描画さ Step4 れる Step5 目標 • 複合図形クラスに共通するメソッドをまとめたCompoundDrawableを定義し、Treeクラスを描画する • TreeクラスのようなDrawableを実装するクラスをメンバーに持つ複合図形クラスを３個以上作る • CompoundFigureクラスを定義し、複合図形クラスに共通する処理をまとめ、Step5で作ったクラスの発展1 Superクラスとする発展2 • おえかきツールにオリジナルの機能を追加する（Undoとかキャプチャとか）