Xamarin Xaml bind more than 2 properties to a TextCell

user_11826190 0
Viewed 1310

I'm wanting to bind more than 2 properties to my list is this even possible check my code below

<ListView x:Name="APRListView"
                  Grid.Row="4"
                  Grid.RowSpan="5"
                  Grid.Column="0"
                  Grid.ColumnSpan="4"
                   Margin="10,-20,-50,-300">
                  <ListView.ItemTemplate>
                      <DataTemplate>
                          <TextCell
                              Text="{Binding ProductName}"
                              Detail="{Binding Monthly}"
                          />
                      </DataTemplate>
                  </ListView.ItemTemplate>
        </ListView>

Is there another approach to this?

I would also like to add text to the detail also ie on Detail="{Binding Monthly}" I'd like it to return on the frontend - Monthly: {Monthly}

xamarin.forms xamarin xaml
3 Answers

use a ViewCell to compose your own layout, and use a Label with FormattedText to include multiple sources of text in one Label

<DataTemplate>
  <ViewCell>
    <StackLayout>
      <Label Text="{Binding ProductName}" />
      <Label Text="{Binding Monthly}" />
        <Label.FormattedText>
          <FormattedString>
                <Span Text="Monthly: " />
                <Span Text="{Binding Monthly}" />
          </FormattedString>
        </Label.FormattedText>
    </StackLayout>
  </ViewCell>
</DataTemplate>
Jason_13380

According to Jason's code, you can also try to use StringFormat binding in label, please take a look:

 <ListView HasUnevenRows="True" ItemsSource="{Binding products}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout>
                            <Label Margin="10" Text="{Binding ProductName}" />
                            <Label Text="{Binding Monthly, StringFormat='Monthly: {0:N}'}" />
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

The Screenshot is :

enter image description here

user_67174450

Please check my code it will help you to find multiple bindings to textcell :

XAML Code 

<ListView HasUnevenRows="True" ItemsSource="{Binding DemoItems}" SeparatorVisibility="None">
        <ListView.ItemTemplate>
            <DataTemplate>
                <TextCell Text="{Binding name}" TextColor="Red" Detail="{Binding details}" DetailColor="Green">

                </TextCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

Binding ViewModel

this.BindingContext = new TestPageViewModel();

ViewModel Code:

public class TestPageViewModel : PlusDoctor.ViewModels.BaseViewModel
{
    private ObservableCollection<DemoDTO> demoItems;
    public ObservableCollection<DemoDTO> DemoItems
    {
        get { return demoItems; }
        set
        {
            demoItems = value;
            OnPropertyChanged();
        }
    }

    public TestPageViewModel()
    {
        DemoItems = new ObservableCollection<DemoDTO>() {
        new DemoDTO(){ name="abc", details="ABC details" }, new DemoDTO(){ name="xyz", details="XYZ details" } };
    }
}

Data Model

public class DemoDTO
{
    public string name { get; set; }
    public string details { get; set; }
}

Output :

enter image description here

Hope it will work for you

Thanks

user_85428620
Related