「おとは@でいじー開発部」トップページに移動します
プロフィール
短く紹介
一応肩書付き最前線プロのプログラマーです☆
デザイン、サウンド、企画、設計、プログラム構築まで幅広く知識を身につけるべく修行に励んでおります!!
ハードウェア開発の沼にどっぷり漬かってぬくぬく☆

ひとり言
ハードウェア開発に興味を持ってしまった・・・当分はハードウェアについて記事を書いていくのだ♪♪
WPFの紹介ウェブページもある程度コンテンツが増えたのでライブラリの公開を一時中断したよ(爆)
スポンサード リンク
カレンダー
2023年 3月
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31  
人気記事
- 2017/11/28 22:40 (0)
新規記事
- 2017/11/28 22:40 (0)
コメント
登録はありません
トラックバック
登録はありません
バックナンバー
RSS
常に最新情報を得るためにはRSSを利用しましょう。
QRコード
QR Code

現在のページを通報
「ぶろぐるすとーりーと管理人」へ不適切な記事の通報が行えます。
通報を行いたい対象記事のみを表示した状態で通報して下さい。

直近記事のリンク



アプリ製作の流れ

投稿日時 2015/02/06 00:57:09

ゲストさん、こんにちはhappy01

高級アプリ製作の極意 ~WPF編~ のお部屋へようこそ。
このお部屋では  第4章   の「  アプリ製作の流れ  」についてお話したいと思います。

まずは前回作成したソリューションを開いてみましょうnote
もう開いてるってsign02 ・・・ではでは始めましょうhappy02

アプリの製作において大事なことはユーザーインターフェースを設置することですsign03
操作できなきゃウィンドウなんていらないし見せる必要もないからねっcoldsweats02
おとは@開発隊長さんの投稿画像
それじゃ、シンプルな ラベル(Label) を配置してみましょう。
one ツールボックスを選ぶwrench
 ※ツールボックスが表示されていない時は「表示(V)」から「ツールボックス(X)」を選んでください。又はCtri+Alt+Xを押すと表示されるよeye
two Labelを探しますrun
three MainWindow.xamlを開いてアクティブにしている状態にして、表示されているウィンドウにマウスでドラッグアンドドロップで貼り付けますart
four デザイン画面にLabelの文字のユーザーインターフェースが表示されてXAMLのウィンドウにLabelのタグが記述されますpen

どんな種類のユーザーインターフェースがあって、どんなことが出来るかについてですが・・・
数が多いので複数回に分けてご紹介しますhappy01
最初は第6章「
基本ユーザーインタフェース」で紹介しますのでお楽しみにhappy02

次は配置したLabelの設定を変更してみますsign01

おとは@開発隊長さんの投稿画像
Labelは主に説明に利用します。
上の画像はひとつ前の画像から2つの変更を行いましたpen
1つは、表示文字を"Label"から"Contentに表示したい文字列を設定します"に変えましたon
もう1つは、位置を画面の左上から10x10離した位置に配置を移動しましたdelicious

デザイン上とXAML上の相対関係を説明しますね。
先に、XAMLは XML構文と同じ なので <タグ></タグ> という書き方と <タグ /> という書き方ができます。
なお、タグと書いたところは エレメント と言います。
また、<タグ 名前="値" />と書く場合の名前は アトリビュート で"値"は バリュー です。
バリューは必ず ダブルクオーテーション(") で挟んで指定します。

:Contentというアトリビュートに任意の文字を設定することで表示文字を変更できますwrench
黄緑 :Labelを左基準で配置することを指定していますnote
:Labelを上基準で配置することを指定しています
note
水色 :Marginのアトリビュートは配置位置指定が行えてカンマ(,)区切りで4つのバリューを指定します。
左から、"左,上,右,下"の位置のバリューを指定します。
今回のLabelは黄緑の左基準と赤の上基準の設定に基づき、Marginも左と上のみ指定しています。
結果、ウィンドウの左から10ピクセルと上から10ピクセルの位置にLabelが表示されました。



アプリと言えば テキスト入力 でしょsign03
おとは@開発隊長さんの投稿画像
と言うことでテキスト入力機能を実装するためにTextboxをツールボックスから貼り付けました。
配置まではLabelの時と同じなので省略していますsweat01

one Textboxを配置して表示されているデザインとXAMLですlovely
デフォルトでTextのアトリビュートには"Textbox"という文字が入っていますが最初からTextboxなんて文字が入力された怪しいツールはそこらに存在しませんのであえて削除しましたdash

TextboxはLabelと違って最初から位置だけでなく、横幅と縦幅が指定されていますshine
横幅と縦幅の指定はWidthとHeightのアトリビュートですsign01
上記の画像では横幅だけ224pixelまで引き延ばしました、大きさに意味はないけどねcoldsweats02

こんな形で ユーザーインターフェースをどんどん配置していって提供したい機能を実装 しますsign01
今回はユーザーインターフェースの見た目の作成のみ説明しました。
なので次回は実際に ソースコードを書いていきます sign03


投稿者

おとは@開発隊長  

カテゴリー

C#言語

タグ

Windows C# WPF
  • Yahoo!ブックマークに登録
  • このエントリーをはてなブックマークに追加
コメント ※ぶろぐ管理者による許可があるまで投稿コメントは表示されません

*が付いた項目は入力が必須となっています。

名前

タイトル

メールアドレス

リンクURL

本文 *


※200文字まで

画像認証 *

スパム対策のためご協力下さい 
  


<ぶろぐ管理者による公開待ち>
投稿者 GoldenTabsさん 投稿日 2018/01/08 18:14
 


直近記事のリンク



ページビューカウンター
145152
ウェブページ
+ハードウェア編
+ソフトウェア編
+ノウハウ・技能編
+道具・雑貨編
+初級編
+中級編
+上級編
+番外編
+初級編
+中級編
フリースペース
☆ハイレゾ音源☆

☆お絵かきするなら☆

☆カスタムPC☆

ギャラリー
カテゴリー
ほびぃ~
くりえいてぃぶ
電子回路 (14)
ぷろぐらみんぐ
C#言語 (21)
C++言語 (4)
PHP言語 (3)
あいてぃー・こんぴゅーた
ぷろふぇっしょなる
全般 (16)
れびゅー
お気に入りたぐ
ツイッター
お問合わせ
ぶろぐ管理者にお問合わせしたい時は専用フォームから連絡が行えます。


  • ipv6 ready
Blogle Storeet Core System v2.0a
おとはうぇぶあぷりぶ (IPv4) v2.6a
Copyright (C) 2014-2018 Blogle Storeet Development Team.