I'd like to welcome you to your second Guice framework tutorial.

回目のギース・フレームワーク・チュートリアルへようこそ。

Today we're going to be going over the document windows class, which is what allows us to create a blank window for our app where we can change its appearance and size.

今日はドキュメント・ウィンドウ・クラスについて説明します。ドキュメント・ウィンドウ・クラスでは、アプリ用に空白のウィンドウを作成し、その外観やサイズを変更することができます。

As I've said before, I'm learning Guice myself, so I'm going to be creating these new tutorials as I learn, and I hope that they're going to help you learn as well.

前にも言ったように、私自身Guiceを学んでいるところなので、学びながら新しいチュートリアルを作っていくつもりです。

And because I'm just learning the Guice framework, I'm going to be a little bit more thorough with the way that I'm going through these classes and through these tutorials.

そしてGuiceフレームワークを学んだばかりなので、これらのクラスやチュートリアルの進め方をもう少し徹底してみようと思う。

So I'm going to be basically trying to explain everything that I can rather than just throwing in random stuff.

だから、僕は基本的に、適当なことを放り込むのではなく、説明できることはすべて説明しようと思っている。

So as I said before, today we're going to be going through the document windows class, and that's going to allow us to create basically a blank slate with maximize and minimize windows and close windows for us to create our application.

前にも言ったように、今日はドキュメント・ウィンドウ・クラスについて説明します。このクラスでは、アプリケーションを作成するために、最大化ウィンドウと最小化ウィンドウ、クローズ・ウィンドウを備えた基本的に白紙の状態を作ることができます。

This is going to follow closely the Guice application window class tutorial that's on their website, and I'm going to link that below.

これは、Guiceのウェブサイトにあるアプリケーション・ウィンドウ・クラスのチュートリアルに忠実に従います。

There's also a project that I'm going to link below as well that I've downloaded from the Guice website, and this is what I'm going to be following along with, and I would advise you to download that project as well and follow along so you can learn.

また、私がギースのウェブサイトからダウンロードしたプロジェクトを下にリンクしておく。

So I'm just going to open this project here, which is mainwindowtutorial.juicer.

それでは、このプロジェクト（mainwindowtutorial.juicer）を開きます。

So we're just going to go through just the steps.

だから、手順を追って説明するだけだ。

I like to do a lot of repetition to try to get to know the workflow of something new.

新しいことのワークフローを知るために、何度も繰り返すのが好きなんだ。

So just going through opening the Pro Juicer, and we have our main.cpp file here.

プロジューサーを開いて、ここにmain.cppファイルがあります。

So now we're just going to open it up in Xcode.

それではXcodeで開いてみよう。

Okay, we're on Mac once again, so just going to wait for that to open.

よし、またマックに戻ったから、開くのを待とう。

Okay, so I've taken a look at this already and kind of gone through it, so I'm going to explain it to you the best that I can.

オーケー、では、私はすでにこれを見て、一通り説明した。

This may look like a lot to really take in, but trust me, when you break it down, it's a little bit more simple than it probably looks at first.

これは、本当に多くのことを理解するように見えるかもしれませんが、私を信じて、それを分解すると、おそらく最初に見えるよりも少し簡単です。

So first, we have a class called mainwindowtutorialapplication, which we can see inherits from another class called the Guice application.

まず、mainwindowtutorialapplicationというクラスがあり、これはGuiceアプリケーションという別のクラスを継承していることがわかります。

This is just really what allows the Guice framework in your app to kind of start and shut down when it needs to shut down.

これは、アプリ内のGuiceフレームワークが起動し、シャットダウンする必要があるときにシャットダウンできるようにするものだ。

So it's just, you know, you're kind of overriding functionality.

つまり、機能を上書きしているようなものなんだ。

So these functions here are just kind of your basic functionality for the Guice framework.

これらの関数は、Guiceフレームワークの基本的な機能です。

Okay, and then if we scroll down a little bit further, we see another class that's inside of this that's called mainwindow, which inherits from what we were discussing before, the document window class.

もう少し下にスクロールすると、この中にmainwindowという別のクラスがあり、これは前に説明したドキュメント・ウィンドウ・クラスを継承している。

Okay, so what we're going to do first is we're going to just command click into document window, command click into this class here just so we can take a look and see the documentation on what exactly the document window class is.

ではまず、ドキュメント・ウィンドウをコマンド・クリックし、このクラスをコマンド・クリックします。

Okay, so we're going to click in there, and I should mention that in my readings I've seen that what they say is that when you're creating a class within Guice, what you would normally do is inherit from a Guice class in this type of fashion, and that'll allow you to have the functionality that you need to do whatever you need to do, and then also to create new things as you need to add more scope to your class.

Guiceの中でクラスを作成する場合、通常はこのような方法でGuiceのクラスを継承することになります。

Okay, so here we go.

さて、それでは始めよう。

The documentation is really good in Guice, so we can see here that it just says that the document window class is a resizable window that has a title bar, maximize, minimize, and close buttons.

Guiceのドキュメントは実によくできているので、ここではドキュメント・ウィンドウ・クラスがタイトル・バー、最大化、最小化、閉じるボタンを持つリサイズ可能なウィンドウであると書かれていることだけを見ることができる。

Okay, now if we scroll down just a little bit, we can take a look at the that we have our constructor here that has a set of parameters, so we're just taking a look at what those are about.

少し下にスクロールして、コンストラクタのパラメータを見てみましょう。

Okay, so here we have just an explanation here up above, so we have a name for our window, a background color, and then the required buttons.

ウィンドウの名前、背景色、そして必要なボタンです。

Now, I found it really interesting the way that these buttons are set up, and it was something new that I learned, and I thought that I should just take a moment to just kind of go through that for other people that might not know.

このボタンがどのようにセットアップされているのか、とても興味深かったし、新しい発見でもあった。

So this approach that they are taking to adding certain buttons or taking them away is called a bit mask.

つまり、特定のボタンを追加したり取り除いたりするこのアプローチは、ビットマスクと呼ばれるものだ。

Okay, and I've just kind of typed this down real quick.

オーケー、そして、私はこれを本当に素早くタイプダウンした。

So if you know about bitwise operations, this is basically where instead of talking about numbers specifically, you're actually talking about the numbers as they're in binary and using these to actually create functions.

ビット演算について知っているなら、これは基本的に、具体的な数値について話す代わりに、2進数の数値について話し、それを使って実際に関数を作るということだ。

So that might sound a little bit confusing.

だから、少し混乱するかもしれない。

Let me see if I can explain a little bit better.

もう少しうまく説明できるか試してみよう。

So if we look here, okay, and if we go back to thinking about numbers in binary, okay, if we just look here at this 0001, okay, that's one, that's the number one in binary, right?

2進数で数字を考えることに戻って、0001を見てみよう。

So and then if we look at 0010, that's the number two in binary, and then four in binary is 0100.

0010は2進数で2、4は2進数で0100となる。

Okay, and then seven in binary is 0111.

じゃあ、2進数の7は0111だね。

Okay, so if we just look over here to the left, the way that they've got these title button bars, title bar buttons, rather.

では、左側を見てみましょう。タイトル・ボタン・バー、タイトル・バー・ボタンがありますね。

So you can see that the minimize button is would be button one, maximize button would be button two, close button would be four, if you want all the buttons, it would be seven.

つまり、最小化ボタンはボタン1、最大化ボタンはボタン2、閉じるボタンはボタン4、すべてのボタンが必要な場合はボタン7ということになる。

Okay, which is a little bit strange, but I find it really interesting.

ちょっと変な話だけど、すごく面白いんだ。

And so you can see that I shouldn't take too long on this, but I just found it really fascinating.

だから、あまり長くは書かない方がいいのは分かってもらえると思うが、本当に魅力的だと思ったんだ。

So you can see here that if it's just the one in the one spot, then it's just minimize, if it's just the one in the two, in the twos spot, then it would be the maximize button, and then just the one in the fours spot, then it would be just the close button.

つまり、1つだけなら最小化ボタン、2つだけなら最大化ボタン、4つだけなら閉じるボタンということだ。

But if it's all of them, then it's all the buttons.

でも、それが全部だとしたら、すべてのボタンということになる。

Okay, so yeah, I just found that interesting.

オーケー、それで、僕はそれが面白いと思ったんだ。

And I'll link you to a tutorial video on bitmasks.

ビットマスクのチュートリアルビデオもリンクしておくよ。

And yeah, it's the tutorial that I read in juice said that they use that quite often as well.

そうそう、ジュースで読んだチュートリアルでも、よく使うって書いてあった。

So something that you probably want to pick up if don't know it already.

だから、もしまだ知らないのなら、手に取ってみてほしい。

Okay, so going back.

さて、話を戻そう。

So we have the document window constructor, as I said before, okay, so it has a name.

ドキュメント・ウィンドウのコンストラクタは、前にも言ったように名前を持っている。

Okay.

オーケー。

And then if we look, if we go back just above here, to our initialize, okay, so the applications initialization codes, that's what happens when the application first starts.

アプリケーションの初期化コードは、アプリケーションが最初に起動したときに実行されるものです。

Okay, so we got main window equals new main window, get application names that so if I compile that right now, okay, and then um, so I'm just gonna compile that quickly here.

さて、メイン・ウィンドウが新しいメイン・ウィンドウに等しくなったので、アプリケーション名を取得します。

Okay, just waiting.

オーケー、ただ待っているだけだ。

Okay, so we can see here that we have a window that's called main window tutorial, which is the same as my app name.

メイン・ウインドウ・チュートリアルというウインドウがあるのがわかります。

Okay, then we can see that it's it's 300 by 200, it was in the center of the screen when it compiled, and then set visible is the true which just means that it appears on the screen.

そして、visibleをtrueに設定すると、画面上に表示される。

Okay, so let's just change a couple things here.

オーケー、ではここで2つほど変えてみよう。

Okay.

オーケー。

So as I said before, this uses a bit mask to, to create the which buttons appear and which ones disappear.

先ほども言ったように、これはビットマスクを使って、どのボタンが表示され、どのボタンが消えるかを作っている。

Okay, so let's just try button number four, right?

じゃあ、4番のボタンを試してみようか？

Okay, there's a couple different ways that we can do this.

オーケー、これにはいくつかの方法がある。

Okay.

オーケー。

So that's just the close button.

これが閉じるボタンだ。

Okay, so we can we can call that two ways, we can either call it by just by just calling the number four.

オーケー、では2通りの呼び方がある。4という数字だけで呼ぶこともできる。

Okay, so if I go back into documentation again, four is the close button.

さて、もう一度ドキュメントに戻ると、4が閉じるボタンだ。

Okay, it's not very intuitive, is it?

あまり直感的ではないよね？

So probably a better way of saying it would probably be document window.

だから、ドキュメント・ウィンドウと言った方がいいかもしれない。

We got lost here.

私たちはここで道に迷った。

Where am I?

ここはどこだ？

So document window, all buttons.

ドキュメント・ウィンドウ、すべてのボタン。

Okay.

オーケー。

Okay, so let's see if that does it.

オーケー、では、それでできるかどうか見てみよう。

Great.

素晴らしい。

And now we have all of our buttons back.

そして今、私たちはすべてのボタンを取り戻した。

Okay.

オーケー。

So we see that the background color is black.

つまり、背景色が黒であることがわかる。

Let's just change that.

それを変えよう。

So once again, we can just Command click into here, just see what options we have in terms of colors.

もう一度、ここをコマンドでクリックして、色に関してどんなオプションがあるか見てみよう。

Okay, we can see all of these colors.

さて、これらの色はすべて見ることができる。

Let's just try lime green.

ライムグリーンを試してみよう。

There we go.

これでよし。

Window with lime green background.

ライムグリーンの背景の窓。

Okay.

オーケー。

We can change the size here.

ここでサイズを変更できる。

Okay.

オーケー。

And now we have a bigger window.

そして今、私たちはより大きな窓を手に入れた。

Awesome.

素晴らしい。

Okay, so now, what we can do is we can just take a look to see what other functionality that we can get from from this window.

さて、ではこのウィンドウから他にどんな機能が得られるか見てみましょう。

Okay, so the way that I want to do that is by just looking in the juice API itself.

では、Juice API自体を見てみましょう。

Okay, so if we go here to the juice API, just the documentation.

さて、ここでjuice APIをドキュメントだけ見てみよう。

Okay, so what are we looking for?

では、何を探すのか？

Okay, so we need to look in the document window class.

では、ドキュメント・ウィンドウ・クラスを見てみよう。

Okay, so we just go down here to D.

じゃあ、ここからDに下りていこう。

I know some of you might be like, oh, this is, you know, can you just go faster, but I really just want to go through this because this is something that was really useful to me and that I really needed to learn just to get into the kind of flow of how how this framework actually works.

このフレームワークが実際にどのように機能するのか、その流れに乗るために学ぶ必要があった。

Okay, so just bear with me.

じゃあ、我慢してくれ。

So, so we got document window class reference.

そこで、ドキュメント・ウィンドウ・クラスのリファレンスを手に入れた。

Okay, so this tells us all of our all of our functions.

さて、これですべての機能がわかった。

Okay.

オーケー。

And we can just scroll down here, see what other functionality that we have.

この下にスクロールして、他の機能を見ることができる。

Right, so I've already looked through this didn't really see anything that looked really kind of, you know, that I could demonstrate really easily, but thought it'd be cool just to go down here.

そうだね、だから、すでにこれには目を通したんだけど、本当に簡単にデモンストレーションできそうなものはなかった。

So it also shows here what what other classes that is inheriting.

つまり、他のどのクラスを継承しているかも示している。

Okay, so we can see that it's inheriting from the resizable window class.

リサイズ可能なウィンドウ・クラスを継承していることがわかる。

Okay, so it says public member functions.

なるほど、パブリック・メンバー関数と書いてある。

So we can use some of these functions from resizable, the resizable window class and top window class.

そこで、リサイズ可能なウィンドウ・クラスとトップ・ウィンドウ・クラスから、これらの関数のいくつかを使うことができる。

So let's just click it.

では、クリックしてみましょう。

If we click in here in this arrow, it'll show us what we can, what we can do here.

この矢印の中をクリックすると、ここで何ができるかが表示される。

Okay.

オーケー。

So public member functions inherited from resizable window.

そこで、リサイズ可能なウィンドウから継承したパブリック・メンバー関数を使用する。

Okay.

オーケー。

So we got one here, set background color.

ここでひとつ、背景色を設定する。

Okay, so let's, let's just try that real quick.

オーケー、では早速やってみよう。

Okay.

オーケー。

So we'll just do set background color.

では、背景色を設定しましょう。

Okay, and then I'm going to do colors, just from just from what I see up here.

オーケー、ではカラーをやってみよう。

Okay, and then we got, we got a selection of colors here.

それから、ここに色のセレクションがある。

So it was lime green, let's make it back to black again.

ライムグリーンだったから、また黒に戻そう。

Okay, let's see what happens.

よし、どうなるか見てみよう。

Okay.

オーケー。

So there we go.

そうだ。

It's black again.

また黒だ。

Okay.

オーケー。

So let's see if there's some other stuff that we can do quite easily.

では、他にも簡単にできることがあるか見てみよう。

Okay.

オーケー。

So we got this one set resizable.

だから、これはリサイズ可能に設定した。

Okay, so should be resizable.

では、サイズを変更できるようにしましょう。

I don't know exactly what that means.

それが何を意味するのかはよくわからない。

So I'm just going to click in here.

だから、ここをクリックするよ。

Okay, I've already done this, but you know, this is just to help you out just to understand kind of the workflow a little bit.

もうすでにやったことだけど、これはワークフローを理解するための手助けなんだ。

Okay.

オーケー。

So we're just going to click in here, see a little bit more about the function itself.

ここをクリックして、機能そのものについてもう少し見てみよう。

Okay.

オーケー。

And then it gives a really good explanation on how that works.

そして、それがどのように機能するかについて、実に良い説明がなされている。

Okay.

オーケー。

Whether it's resizable at all is the first parameter.

リサイズ可能かどうかが最初のパラメーターだ。

And these are two Booleans.

そしてこれらは2つのブールである。

Okay, use bottom right hand corner resizer.

右下のリサイザーを使ってください。

Okay, so resizing the window using the bottom right hand corner.

では、右下の角を使ってウィンドウのサイズを変更してください。

Okay, so let's just give that a try real quick.

よし、では早速試してみよう。

So we got set resizable.

だから、リサイズ可能に設定した。

Okay, and I'm just going to put true and true again.

オーケー、もう一度 "true "と "true "を並べるよ。

Just compile.

コンパイルするだけだ。

Okay, great.

オーケー、素晴らしい。

So what we have is see if I put my mouse here in the bottom right hand corner, I can resize the window.

右下の隅にマウスを置くと、ウィンドウのサイズを変更できる。

Pretty cool.

かなりクールだ。

Okay, so that's great.

なるほど、それは素晴らしい。

Okay, let's see if there's anything else I'll do.

よし、他にやることがあるか見てみよう。

I'll do one more here.

ここでもうひとつ。

Okay, so if we go, let's go into top level window.

では、トップレベル・ウィンドウに入りましょう。

Okay, another class that the document window is inheriting from.

さて、ドキュメント・ウィンドウが継承している別のクラスだ。

Okay.

オーケー。

And here's another one that I checked out.

そして、もうひとつチェックしたのがこちら。

That was from the juice tutorial set using native title bar.

これは、ネイティブのタイトルバーを使ったジュースのチュートリアルのセットだ。

Okay, so this means whether an OS native title bar will be used or a juice one.

つまり、OSネイティブのタイトルバーを使うか、ジュースのタイトルバーを使うかということだ。

Okay, so if we look right now at what we have at the moment.