fc2ブログ

記事一覧

Androidで画面の背景色(windowBackground)を変更する方法 | Xamarin.Forms


今回はAndroidで画面の背景色を変更する方法をご紹介いたします。Xamarinの初期設定でテーマが設定されていますが、設定したい色と異なっていましたので、変更してみました。しかし、単純にwindowBackgroundに#FFFFFFと設定してもコンパイルエラー(ファイル "obj\Debug\android\bin\packaged_resources" は存在しません。)になったり正しく表示されなかったりしてかなりハマりました。


 xamarin_android_backgroundcolor_01.png



前提条件
・Windows10 Pro 64Bit
・Visual Studio 2015 Community Update3
・Xamarin 4.4.0.34 (NuGet Xamarin.Forms 2.3.4.247)
・macOS Sierra 10.12.4 / Xcode8.3.1 / Xamarin.iOS 10.8.0.175


xamarin_android_backgroundcolor_02.png



1.設定ファイルを作成する

Androidプロジェクト/Resources/drawableフォルダに、「default_background.xml」というファイルを作成します。
default_background.xml
<?xml version="1.0" encoding="utf-8" ?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<color android:color="@color/window_background"/>
</item>
</layer-list>

※「@color/window_background」とは、colors.xmlのcolorタグからwindow_backgroundの値を取得します。画面の背景色になります。



2.テーマを設定する

Androidプロジェクト/Resources/values/styles.xmlに以下の記述(Styleタグのブロック)を追加します。
<?xml version="1.0" encoding="UTF-8"?>
<resources>
  <style name="MainTheme" parent="MainTheme.Base">
</style>
<!-- Base theme applied no matter what API -->
<style name="MainTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<!--画面の背景色を変更する-->
<item name="android:windowBackground">@drawable/default_background</item>
  </style>
</resources>

※「@drawable/default_background」とは、drawableフォルダのdefault_backgroundファイルのことを指します。



3.背景色を設定する

Androidプロジェクト/Resources/values/colors.xml ファイルに以下のカラー定義を追加します。お好みの色に変更してください。
<?xml version="1.0" encoding="utf-8"?>
<resources>
  <color name="window_background">#00FF00</color>
</resources>



4.動作確認

初期設定の状態でMainAvtivity.csに「Theme = "@style/MainTheme"」と記述されていることで手順3で作成したテーマが読み込まれます。
以上で背景色が変更になっているアプリが立ち上がりますので背景色を確認してみましょう。



5.ナビゲーションページの場合

PCLでNavigationPageをインスタンス化してページ遷移している場合は、以下のように記述すると簡単に変更できます。
App.cs
public App()
{
    MainPage = new NavigationPage(new TestPage())
    {
        BackgroundColor = Color.FromHex("#00FF00"),
    };
}



当ブログの内容をまとめた Xamarin逆引きメニュー は以下のURLからご覧になれます。
https://itblog.dynaspo.com/blog-entry-81.html


関連記事

コメント

コメントの投稿

※名前とタイトルが入力されていないコメントでは他のコメントとの区別ができません。

 入力されていないコメントには返信しませんのであらかじめご了承くださいませ。

※ニックネームでも良いので必ずご入力ください。

    

※必ずご入力ください。

    
    

※必ずご入力ください。

※技術的な質問には環境やエラーについて正確かつ詳細にお教えください。

・正確なエラーの内容

・Windowsのバージョン番号

・Visual Studioのバージョン

・機器の型番

・アプリやソフトのバージョン

    

カテゴリ別記事一覧

広告

プロフィール

石河 純


著者名 :石河 純
自己紹介:素人上がりのIT技術者。趣味は卓球・車・ボウリング

IT関連の知識はざっくりとこんな感じです。
【OS関連】
WindowsServer: 2012/2008R2/2003/2000/NT4
Windows: 10/8/7/XP/2000/me/NT4/98
Linux: CentOS RedHatLinux9
Mac: macOS Catalina 10.15 / Mojave 10.14 / High Sierra 10.13 / Sierra 10.12 / OSX Lion 10.7.5 / OSX Snow Leopard 10.6.8
【言語】
VB.net ASP.NET C#.net Java VBA
Xamarin.Forms
【データベース】
Oracle 10g/9i
SQLServer 2016/2008R2/2005/2000
SQLAnywhere 16/11/8
【BI/レポートツール】
Cognos ReportNet (IBM)
Microsoft PowerBI
ActiveReport (GrapeCity)
CrystalReport
【OCX関連】
GrapeCity InputMan SPREAD MultiRow GridView
【ネットワーク関連】
CCNP シスコ技術者認定
Cisco Catalyst シリーズ
Yamaha RTXシリーズ
FireWall関連
【WEB関連】
SEO SEM CSS jQuery IIS6/7 apache2

休みの日は卓球をやっています。
現在、卓球用品通販ショップは休業中です。