web-dev-qa-db-ja.com

Xamarin.FormsでImage Sourceプロパティを正しく使用する方法は？

スタックレイアウトでコンテンツページに画像を表示するのが困難です。 Xamarin APIドキュメントを調べて、 Xamarin.Forms.Image.Source Property が見つかりましたが、どのように書かれているかを確認するサンプルコードはありません。また、C＃でどのように記述されているかを確認し、ファイル名パスの点でコードと一致しているように見えますが、Xamarinでは、これが初めてなので、少し異なる場合があります。 Visual Studio 2013のAndroidエミュレーター（Google Nexus 5）で現在テストしているコードは、画像が表示されないことを除いて、正常に動作します。

画像ソース：

new Image
{
     VerticalOptions = LayoutOptions.Center,
     HorizontalOptions = LayoutOptions.Center,
     Source = "/Assets/xamarin_logo.png",
},

完全なコード：

public NFCPage()
    {
        StackLayout stackLayout = new StackLayout // instantiate a StackLayout object to layout its children
        {
            Spacing = 5, // amount of spae between each child element
            //HorizontalOptions = LayoutOptions.Center,
            VerticalOptions = LayoutOptions.FillAndExpand, // defines how the elements should be laid out; fill the entire width of the content to the screen
            BackgroundColor = Color.Blue,

            Children = // gets a list of child elements
            {
                new Label
                {   
                    TextColor = Color.White,
                    BackgroundColor = Color.Red,
                    XAlign = TextAlignment.Center, // set text alignment horizontally
                    Text = "Google",
                },
                new Label
                {
                    Text = "Place your device directly at the symbol.",
                    XAlign = TextAlignment.Center,
                    TextColor = Color.White,
                },
                new Image
                {
                    VerticalOptions = LayoutOptions.Center,
                    HorizontalOptions = LayoutOptions.Center,
                    Source = "/Assets/xamarin_logo.png",
                },
                new Button
                {
                    Text = "QR Code",
                    TextColor = Color.White,
                },
                new Button
                {
                    Text = "?",
                    TextColor = Color.White,
                },
            }
        };
        Content = stackLayout; // apply stackLayout to Content
    }
c#xamarinxamarin.formsimagesource
23
TheAmazingKnight

ソースプロパティはクロスプラットフォームであり、すべてのプラットフォームには画像などのアセット用の異なるフォルダーがあるため、パスを参照しないでください。ファイル名と拡張子を指定するだけです。 Imageクラスは、ファイルの検索場所を知っています。

画像ファイルは各アプリケーションプロジェクトに追加し、Xamarin.Forms共有コードから参照できます。すべてのアプリで単一の画像を使用するには、すべてのプラットフォームで同じファイル名を使用する必要があり、有効なAndroidリソース名（スペースや特殊文字を含まない）でなければなりません。ビルドアクション：AndroidResourceのResources/drawableディレクトリ。イメージの高DPIバージョンと低DPIバージョンも指定できます（drawable-ldpi、drawable-hdpi、drawable-xhdpiなどの適切な名前のResourcesサブディレクトリ）。

enter image description here

var beachImage = new Image { Aspect = Aspect.AspectFit };
beachImage.Source = ImageSource.FromFile("waterfront.jpg");

出典：https://developer.xamarin.com/guides/xamarin-forms/working-with/images/#Local_Images =

32
Adam

コードを使用して画像を追加する場合は、これを試してください

自動的にダウンロードされ、画像が表示されます

        var webImage = new Image { Aspect = Aspect.AspectFit };
        webImage.Source = ImageSource.FromUri(new Uri("https://xamarin.com/content/images/pages/forms/example-app.png"));
6
Asbar Ali

Resources/Drawableフォルダーをクリックしてソリューションエクスプローラーに画像を追加し、New/Existing itemを選択します。画像をResources/Drawableフォルダーにコピーしないでください。役に立てば幸いです。

3
Karthikeyan Ramasamy