Xamarin 中的 ListView 备用行颜色

如何解决Xamarin 中的 ListView 备用行颜色

在我的 Xamarin 应用程序中，我使用 foreach 循环获取可用凭据的名称和值，然后使用 {{ 在屏幕上打印它1}}。

例如

名称 1
值 1

名称 2
值 2

它工作正常。我现在想要的是改变Name(ListView)的样式。

例如

名称 1
价值

名称 2
价值

View.xml

_attributes.Add(item.Name.ToString());

viewmodel.cs

<ListView
    SeparatorVisibility="None"
    BackgroundColor="#FFFFFF"
    ItemsSource="{Binding Attributes}"
    HasUnevenRows="true">

    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Label
                    Text="{Binding .}" 
                    TextColor="#000000"
                    FontSize="18"
                    Padding="10" >
                </Label>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

更新

foreach (var item in _credential.CredentialAttributesValues)
{
    _attributes.Add(item.Name.ToString());
    _attributes.Add(item.Value.ToString());
}

private ObservableCollection<string> _attributes = new ObservableCollection<string>();
public ObservableCollection<string> Attributes
{
    get
    {
        return _attributes;
    }
    set
    {
        this.RaiseAndSetIfChanged(ref _attributes,value);
    }
}

<ViewCell>
    <StackLayout>
        <Label
        Text="{Binding Name}" 
        TextColor="#000000"
        FontSize="18"
        Padding="10"
        Margin="10,0">
        </Label>

        <Label
        Text="{Binding Value}" 
        TextColor="#000000"
        FontSize="18"
        Padding="10"
        Margin="10,0">
        </Label>
    </StackLayout>
</ViewCell>

解决方法

由于您使用了字符串数据类型，因此很难理解集合中的哪个字符串将是名称，但是如果您想根据索引给出样式，您可以点击以下链接：

https://blog.verslu.is/stackoverflow-answers/alternate-row-color-listview/

或

假设您有名为 Credential 的模型

public class Credential
{
    public string Name { get; set; }
    public string Value { get; set; }
}

并在您的 ViewModel

private ObservableCollection<Credential> _attributes = new ObservableCollection<Credential>();
public ObservableCollection<Credential> Attributes
{
   get
   {
       return _attributes;
   }    
   set
   {
       this.RaiseAndSetIfChanged(ref _attributes,value);
   }
}

并在 .xaml 中

<ListView
    SeparatorVisibility="None"
    BackgroundColor="#FFFFFF"
    ItemsSource="{Binding Attributes}"
    HasUnevenRows="true">

    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout>
                    <Label
                        Text="{Binding Name}" 
                        TextColor="#000000"
                        Style="[Whatever you want...]"
                        FontSize="18"
                        Padding="10" >
                    </Label>
                    <Label
                        Text="{Binding Value}" 
                        TextColor="#000000"
                        FontSize="18"
                        Padding="10" >
                    </Label>
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

您也可以使用单个标签来实现您的问题中请求的视图要求。

<Label>
   <Label.FormattedText>
      <FormattedString>
         <Span Text="{Binding Name}" TextColor="Black" />
         <Span Text="&#10;" />
         <Span Text="{Binding Value}" TextColor="Gray" />
      </FormattedString>
   </Label.FormattedText>
</Label>

,

View.xml

<ListView.ItemTemplate>
    <DataTemplate>
        <ViewCell>
            <Label
                Text="{Binding .}" 
                TextColor="#000000"
                Style="{StaticResource LabelStyle}"
                FontSize="18"
                Padding="10" >
            </Label>
        </ViewCell>
    </DataTemplate>
</ListView.ItemTemplate>

Style.xaml

<ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms" 
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="NameProject.Style.GeneralStyle">

<Style TargetType="Label" x:Key="LabelStyle1">
    <Setter Property="Padding">
        <Setter.Value>
            <OnIdiom x:TypeArguments="Thickness" Phone="10" Tablet="50"/>
        </Setter.Value>
    </Setter>
    <Setter Property="FontSize">
        <Setter.Value>
            <OnIdiom x:TypeArguments="x:Double" Phone="18" Tablet="24"/>
        </Setter.Value>
    </Setter>
    <Setter Property="TextColor" Value="red"/>
</Style>

<Style TargetType="Label" x:Key="LabelStyle2">
    <Setter Property="Padding">
        <Setter.Value>
            <OnIdiom x:TypeArguments="Thickness" Phone="12" Tablet="50"/>
        </Setter.Value>
    </Setter>
    <Setter Property="FontSize">
        <Setter.Value>
            <OnIdiom x:TypeArguments="x:Double" Phone="20" Tablet="24"/>
        </Setter.Value>
    </Setter>
    <Setter Property="TextColor" Value="Blue"/>
</Style>

</ResourceDictionary>

Style.cs

public static General SharedInstance { get; } = new General();

App.cs

dictionary.MergedDictionaries.Add(Style.General.SharedInstance);