2016-07-08 8 views
2

こんにちは私は、リストビューでアイテムをタップすると、別のページに移動することができますラベル内のテキストの左側に画像を追加することができます。しかし、複数のラベルがXamarinフォームのリストビュー内の複数のアイテムにイメージセルを追加する方法

はので、どのように私はラベルごとに異なる画像を得るでしょう、私は私のプロジェクト内のコンテンツフォルダ内の画像を持っているlisviewであり、ここに私のXAMLです:

<?xml version="1.0" encoding="utf-8" ?> 
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
      x:Class="App.HomePage"> 
    <ListView x:Name="listView" HasUnevenRows="true" ItemSelected="OnItemSelected"> 
    <ListView.ItemTemplate> 
     <DataTemplate> 
     <ViewCell> 
      <Frame Padding="0,0,0,8" BackgroundColor="#d2d5d7"> 
      <Frame.Content> 
       <Frame Padding="15,15,15,15" OutlineColor="Gray" BackgroundColor="White"> 
       <Frame.Content> 
        <StackLayout Padding="20,0,0,0" Orientation="Horizontal" HorizontalOptions="CenterAndExpand"> 
        <Label Text="{Binding Name}" 
          TextColor="#69add1" 
          FontFamily="OpenSans-Light" 
          FontSize="24"/> 
        </StackLayout> 
       </Frame.Content> 
       </Frame> 
      </Frame.Content> 
      </Frame> 
     </ViewCell> 
     </DataTemplate> 
    </ListView.ItemTemplate> 
    </ListView> 
</ContentPage> 

ここに私のコードが背後にあるのです。

using App.Data; 
using App.Road; 
using App.Plan; 
using App.Radar; 
using System.Collections.Generic; 

using Xamarin.Forms; 

namespace App 
{ 
    public partial class HomePage : ContentPage 
    { 
     public HomePage() 
     { 
      InitializeComponent(); 
      var name = new List<Tools> 
       { 
        new Tools("Plan and Prepare"), 
        new Tools("Contact Local Agency"), 
        new Tools("Road Closings"), 
        new Tools("Weather Radar") 
      }; 

      listView.ItemsSource = name; 
      Content = listView; 
     } 

     void OnItemSelected(object sender, SelectedItemChangedEventArgs e) 
     { 
      var tools = e.SelectedItem as Tools; 

      if (tools == null) 
      { 
       return; 
      } 

      ContentPage page = null; 

      switch (tools.Name) 
      { 
       case "Plan and Prepare": 
        page = new PlanHome(); 
        break; 
       case "Contact Local Agency": 
        page = new CountySelect(); 
        break; 

       case "Road Closings": 
        page = new RoadHome(); 
        break; 

       case "Weather Radar": 
        page = new RadarHome(); 
        break; 

       default: 
        page = new HomePage(); 
        break; 
      } 

      ((ListView)sender).SelectedItem = null; 
      page.BindingContext = tools; 
      Navigation.PushAsync(page); 
     } 
    } 
} 

何か助けが素晴らしいだろう!事前に

感謝:)

答えて

3

代わりViewCellImageCellを使用する必要があります。

ドキュメントhereと完全な例hereです。

コードサンプル:

<ListView x:Name="list"> 
       <ListView.ItemTemplate> 
        <DataTemplate> 
         <ImageCell 
          Text="{Binding Name}" 
          Detail="{Binding Position, StringFormat='{0}'}" 
          ImageSource="{Binding Image}"> 
         </ImageCell> 
        </DataTemplate> 
       </ListView.ItemTemplate> 
      </ListView> 
+0

私がやったことは、ViewCellを保持しているだけで、<画像 Horizo​​ntalOptions = "StartAndExpand" ソース= "{バインディングイメージ}" />をラベルの上に追加してトリックを追加しました:) – Phoneswapshop

+0

@jzeferino ImageSourceの使い方は?私はバイト[]を持っていて、私はそれを私のリストの "Image"と呼ぶべきですか? – ChrKahl

+0

これを試してください: 'ImageSource.FromStream(()=>新しいMemoryStream(imageAsBytes));' – jzeferino

2

私は1つのサンプルコードの解決策を見つけました。 ViewCellの代わりにImageCellを使用します。

コードサンプル:

<ListView x:Name="listEntries" ItemsSource="{Binding Entries}"> 
      <ListView.ItemTemplate> 
      <DataTemplate> 
       <ImageCell 
       Text="{Binding Name}" 
       ImageSource="{Binding Image}" 
       > 
       </ImageCell> 
      </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 

私は '文字列からImageSourceはにImage'-プロパティ、その後でそれを満たした' 変更ImageSource.FromStream(() => new MemoryStream(pictureByteArray)) "

そして、それは働きました!

関連する問題