KONNO Kiyotaka

9.4 スキャフォールディングとRichWidgetを使ってみよう(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。8.2 ウェブサービスのエクササイズ(OutSystems セルフトレーニング) Part 1: Add Cinemas at Warp Speed 前に画面を誰かが勝手に作ってくれたと思ったのは、スキャフォールドだったんですね。 勝手に作るんじゃなくて、ドラッグ&ドロップで作ってくれるというのも良いなと思います。 さらに画面へのドラッグ&ドロップで明細画面を追加してくれて、ポップアップエディタまで作ってくれるのはすごい。 で、ポップアップエディタは作ってくれましたが、Popup_InfoBalloonはダメでした。今度は検索したら選択肢には出てきますが、ドロップするとエラー。 もしかしてlondonじゃないから? 変えるのも大変そうだけど・・・ https://www.outsystems.com/forums/discussion/15489/changing-the-theme-of-my-application/#Post84632 Part 2: RichWidgets とりあえず進めてみる。 LayoutsOther¥Layout_Popup を選択するところは、LayoutOther が存在しないため、Layouts¥LayoutPopup を選択してみたが、削除することになっているHader もFooter もないので、やはり違うみたい。 MovieTable のStart Index プロパティに、List_Navigation_GetStartIndex(MovieTable.Id) を指定するとのことだが、エラーになってしまう。 それは諦めて、Dynamic Sortingの追加をしたら、またエラー。 一旦追加したList_SortColumn を削除したのですが、復活せず。 最後に破壊してしまいました。 とりあえず、この先は別のアプリを作ってみるエクササイズなので、OutSystems セルフトレーニングシリーズは、ここで一旦終了とします。

8.2 ウェブサービスのエクササイズ(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。7.4 セッションハンドリングのエクササイズ(OutSystems セルフトレーニング) Part 1: Add a Reference to a REST endpoint こんなサイトがあり、APIを提供している。 https://www.themoviedb.org/ Part 2: Define Site Properties for the API サイトプロパティの追加のみ Part 3: Call a Web Reference method 画像を選択するところで、RichWidgetsが表示されないので、Header_Logoというものが選択できない。 まあ、普通のLogoでもよいか。 そして、ここではStyle Editorが登場する。 ServiceCenterでログも見られます、は良いが、詳細のリクエスト内容までは見えないですね。 Part 4: Implement a Web Service Callback OnAfterResponse というコールバックイベントが用意されています

7.4 セッションハンドリングのエクササイズ(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。6.4 ウェブブロックとUIを再利用してみよう(OutSystems セルフトレーニング) Part 1: Create and use Session Variables Find Usages みたいな技を教えてくれるのは良いですね Part 2: Create and use Site Properties サイトプロパティを変えてもブラウザ再表示でMovie詳細画面のまま反映された。

6.4 ウェブブロックとUIを再利用してみよう(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。6.2 画面のライフサイクル: Ajaxのエクササイズ(OutSystems セルフトレーニング) Part 1: Create a Web Block for star ratings Placeholder のwidth はempty にはできず、Fullにしておく Part 2: Make the stars in the Block clickable Search Box で「Notify」を検索することとなっているが、検索されない。 https://www.outsystems.com/forums/discussion/41219/notify-deprecated-in-service-studio-11-what-can-i-use-to-replace-it/ Manage Dependencies (ctrl + q) で探してくれは良いけど、Deprecated(廃止予定)ってどういうこと?そちらを教えて欲しい・・・ ・・・一応その回答はこちら。 https://success.outsystems.com/Documentation/11/Developing_an_Application/Design_UI/Reuse_UI/Use_Events_to_Propagate_Changes_From_a_Block_to_the_Parent これまでは、ウェブブロックの中でScreenAction(テキストではStarClicked)を定義して、それをNotifyするという仕組みだったのが、11では、ScreenActionとは別のEventというものが定義できるようになった。 Notifyのメッセージとして、値等(StarIterator.List.CurrentRowNumber + 1)を定義し、さらに親画面におけるウェブブロックインスタンスのDestinationとしてアクション(OnRatingNotify)を作成して指定する、と言う流れだったのが、バージョン11では、親画面でイベントに対応するハンドラを書く、と言う感じ? そして、Destinationのアクション(OnRatingNotify)の記述として、Figure 26のような割と複雑なロジックを作っていくわけですが、これはどう書くのだろう・・・ ちょっとテキストがバージョン11に追いついていないので、ここは飛ばしていきます。 Eventsという形にしたのは悪くないと思うのですが。

6.2 画面のライフサイクル: Ajaxのエクササイズ(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。5.7 Input Validationのエクササイズ(OutSystems セルフトレーニング) Part 1: Add a comments sidebar to movie Container の幅指定の方法は変わっている。 Styles Editor を指定。 bold 、italic 設定もStyles Editor で。 CreateUserMovieComment はCoreUserMovieComment の中

Assign してReflesh すると言う流れを理解する


5.7 Input Validationのエクササイズ(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。5.5 Actionとコードを再利用してみよう(OutSystems セルフトレーニング) Part 1: Test the built-in validations Validation設定のServer とServer & Client を試す Part 2: Add validations to editing a movie Feedbackメッセージを日本語で入力しようとしたら文字化けした! ここまで長くなってくると全体が見通せなくなる。 一つ一つのプロパティを見ないと何をやっているのか分からない。 また、この辺でソース管理についての説明があると良いのでは Part 3: Test the validations for editing a movie 動作確認 Part 4: Add validations for editing a person 自分でやってみよう、ということなので、一つだけやって、取り急ぎ進めます。 Part 5: Test the validations for editing people 動作確認

5.5 Actionとコードを再利用してみよう(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。5.3 データのクエリとウィジェットのエクササイズ(OutSystems セルフトレーニング) Part 1: Create a reusable Action 淡々と進めます Part 2: Convert Action to a Function こうして作ったユーザアクションは、基本的には、ステートメントとしてのみ呼び出すことができる、方法はアクションフローへのドラッグ&ドロップ。 FunctionにすることでExpressionの中で呼ぶこともできるようになる。 やることはプロパティを変えるだけ Part 3: Test calling an Action and a Function できるけど、分かったような分からないような(分かっていない)

5.3 データのクエリとウィジェットのエクササイズ(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。4.4 画面のライフサイクル: インタラクションのエクササイズ(OutSystems セルフトレーニング) Part 1: Add participants to a movie アクションからの「New Web Screen」で自動的には名前はつけてくれなかった。(Mac版だから?) 「Link」のプロパティの設定は、Widget Treeで「Actions」の中ににあるリンクを選択。 タイトル欄にExpressionを追加したのち、ムービータイトルを表示させるようにするための設定は、下記の図のような形でダブルクリックにより指定できる。 Windows環境とMac環境両方で開発している場合、すなわち、複数人で開発している場合、モジュール(今回でいうとOSMDb_Core)が変更された場合の再読み込みはそれぞれで行う必要がある(当たり前といえば当たり前)。 再読み込みを行なったいないために、データタイプにPersonMovieRoleが表示されなくて悩んだ。 Part 2: Test the ‘add participants’ to a movie ここまで順調にきたわけですが、ついにエラー発生。よりによって実行時エラー。開発環境側にはエラーはない。 こうなってしまうと、何をすれば良いか分からない。 が、もう少し冷静になって考えてみると、画面を開く時点でエラーになっているので、preparation が怪しいと考えられる。見てみると、赤ではないが黄色の波線。 SQLを実行してみるとエラー。ピリオドとカンマ! ということで修正したら動きました。 SQL書いたらその場でテストしましょう。 Part 3: Display the participants of a movie ではPersonエンティティを取得した上で、PersonMovieRole もソースとして追加し、PersonMovieRoleへのフィルタとして、MovieId とActor を指定しようとしています。 しかし、このActor のフィルタ追加で、PersonRole はないよと言われています。正解は、PersonalRole。 その後Group By の設定をしますが、若干表現が異なります。 そして、それをやった後の画面も相当異なります。 Group By の設定を、テキストの画像にあるように、▽ボタンを押して行うのではなく、右クリックで行なったら、近い形になったので、こちら右リック推奨です。 Part 4: Search and filter the list of movies 淡々と進める

4.4 画面のライフサイクル: インタラクションのエクササイズ(OutSystems セルフトレーニング)

テキストによるエクササイズの続きです。4.2 リレーションのモデリングをしてみよう(OutSystems セルフトレーニング) Part 1: Add the ‘Edit Movie’ feature テキスト通り進められます。 途中で、Movieの中にGenreIdが表示されなくて、追加し忘れていたかと思ったら、追加はしたけど表示更新していなかったということでした。 とりあえず、テキストボックスをドラッグして幅を広げる際のデザイナの表示がかっこいい。こういうの待ってたよ! Part 2: Add the ‘New Movie’ feature 最初に「<>」タブをクリックすると書かれていますが、現在のバージョン11では「Widget Tree」タブですね。 そしてテキストでは「Layout_London」が指定されていたのを今知る・・・ まあ、そのまま進めます。(後から変えられるのかな・・・) Part 3: Test the creation and update of movies 動作確認 ちゃんと動いています Part 4: Add the ‘Edit Person’ feature そのまま進めます Part 5: Add the ‘New Person’ feature 衝撃の事実? 実はここまでにも若干気になっていたのですが、 People とPerson Detail が、結構出来上がっている。 フォームを自動的に作ってくれるので、ある程度上記でやってきたSaveボタンとかは自動的に作ってくれるのかなと思ったりしていたのですが、ちょっとできすぎじゃない?という気が・・・更新後のメッセージとか、このあと作るんじゃないの?みたいなのまでできている。 まさか、小人が作ってる? そうじゃないとすると、他の人と被って更新している?同じ名前だとそんなことが起きうる?ちょっと変な感じ。

4.2 リレーションのモデリングをしてみよう(OutSystems セルフトレーニング)

Modeling Data Relationships Exercise https://www.outsystems.com/learn/lesson/859/modeling-data-relationships-exercise/ 3.3、3.6に続き、テキストをやってみます。3.6 ウィジェットを使ってみよう(OutSystems セルフトレーニング) Part 1: Create a foreign key between Entities テキスト通り 外部キーを追加する際に、カラムの型はデータ自体の型を指定するのではなく、データIdentifierを指定する、というのが面白い Part 2: Create the junction Entities テキスト通り、関連テーブルのエンティティを作成 Part 3: Create an Entity Diagram リレーションの線が自動的に描画されるはずが、最初描画されずに、あれ?と思いましたが、画面をクリックすると表示されました。 Part 4: Publish the application module Management Dependencies画面は若干変わっている。