アフィリエイト広告を利用しています

広告

この広告は30日以上更新がないブログに表示されております。
新規記事の投稿を行うことで、非表示にすることが可能です。
posted by fanblog

2018年04月23日

《その369》画像の表示・非表示


 画像の表示・非表示

 前回《その367》、プロジェクトに画像を取り込みましたが、
今回は、その画像の表示・非表示をボタンクリックで切りかえるアプリを作成します。


Button のプロパティを変更します。
(名前を "btn" にして、共通 Content を "消去" に変更しました。)

add_c003.png


ボタンの文字が "消去" に変わりました。
add_c004.png


稲妻マークをクリックし、Click欄の枠内をダブルクリックします。
add_c005.png



btn_Click関数の記述画面が表示されるので、コードを記述します。
(記述するのは、赤文字のコードのみです。)


//
// MainPage.xaml.cpp
// MainPage クラスの実装。
//

#include "pch.h"
#include "MainPage.xaml.h"

using namespace App3;

using namespace Platform;
using namespace Windows::Foundation;
using namespace Windows::Foundation::Collections;
using namespace Windows::UI::Xaml;
using namespace Windows::UI::Xaml::Controls;
using namespace Windows::UI::Xaml::Controls::Primitives;
using namespace Windows::UI::Xaml::Data;
using namespace Windows::UI::Xaml::Input;
using namespace Windows::UI::Xaml::Media;
using namespace Windows::UI::Xaml::Navigation;

MainPage::MainPage()
{
InitializeComponent();
}


void App3::MainPage::
btn_Click(
Platform::Object^ sender,
Windows::UI::Xaml::RoutedEventArgs^ e)
{
// img が Visible であれば Collapsed に変更し、
// btn の文字を"表示"にします。

if (img->Visibility
== Windows::UI::Xaml::Visibility::Visible)
{
img->Visibility
= Windows::UI::Xaml::Visibility::Collapsed;
btn->Content = "表示";
}

// if文が不成立なら、else if文を実行します。
// img が Collapsed であれば Visible に変更し、
// btn の文字を"消去"にします。

else if (img->Visibility
== Windows::UI::Xaml::Visibility::Collapsed)
{
img->Visibility
= Windows::UI::Xaml::Visibility::Visible;
btn->Content = "消去";
}

}



アプリをスタートして、消去ボタンを押してみます。
add_c006.png


画像が消え、ボタンの文字が "表示" になります。表示ボタンを押してみます。
add_c007.png


再び画像が現れ、ボタンの文字が "消去" に戻ります。
add_c006.png





《その368》画像の取込み


 今回は、プロジェクトに画像を取り込む方法について だけの内容です。
フォーム上に画像を表示させるまでの手順を確認します。


ファイル(F) -> 新規作成(N) -> プロジェクト(P)
add_b031.png


Visual C++ -> Windows ユニバーサル -> 空のアプリ(ユニバーサル Windows)
add_b032.png


そのまま OK
add_b033.png


ソリューションエクスプローラーで 追加(D) -> 既存の項目(G)
表示されるエクスプローラーで、画像を選択します。

add_b034.png


Assetsフォルダのリストに、選択した img01.png が表示されました。
add_b035.png


MainPage.xaml -> 開く(O)
add_b036.png


フォームのサイズ等を調整します。
add_b037.png


表示(V) -> ツールボックス(X)
add_b038.png


Image を選択します。
add_b039.png


Image をドラッグ&ドロップします。
add_b040.png


Image のプロパティで、img01.png を選択しました。
add_c001.png


画像が表示されました。
add_c002.png




 たまに、クリック お願いします m(_ _)m

 AA にほんブログ村 IT技術ブログ C/C++へ

こうすけ:メール kousuke_cpp@outlook.jp

【1】★★C++ 記事目次★★ ← 利用可能です。
・新版明解C++入門編 / 新版明解C++中級編
・その他 C++ 関連記事

【2】★★こうすけ@C#★★
・C# の初歩的な記事


検索
<< 2018年04月 >>
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          
プロフィール
こうすけさんの画像
こうすけ

 たまに、クリック お願いします m(_ _)m

 AA にほんブログ村 IT技術ブログ C/C++へ

こうすけ:メール kousuke_cpp@outlook.jp

【1】★★C++ 記事目次★★ ← 利用可能です。
・新版明解C++入門編 / 新版明解C++中級編
・その他 C++ 関連記事

【2】★★こうすけ@C#★★
・C# の初歩的な記事


×

この広告は30日以上新しい記事の更新がないブログに表示されております。