web-dev-qa-db-fra.com

Puis-je changer la couleur d'arrière-plan dans les cellules ListView sans perdre le retour haptique (tactile)?

(J'ai demandé sur le forums Xamarin mais je n'ai pas eu de réponse, alors j'essaie ici))}

Dans Xamarin Forms, la définition de BackgroundColor dans un ListView ItemTemplateentraîne la désactivation du retour haptique .

Y a-t-il un moyen de contourner cela? J'aimerais personnaliser les couleurs de mes éléments de liste, mais le fait de ne pas avoir de retour haptique ressemble à une foutaise.

Exemple XAML:

 <ListView x:Name="list"
           ItemTapped="OnItemSelected"
           IsGroupingEnabled="True"
           GroupDisplayBinding="{Binding Key}"
           GroupShortNameBinding="{Binding Key}"
           HasUnevenRows="True"
           ItemsSource="{Binding .}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
              <StackLayout VerticalOptions="FillAndExpand"
                           Padding="5, 20"
                           BackgroundColor="#CCCCCC"> <!--This line causes haptic feedback to fail -->
                <Label Text="{Binding Name}"
                       TextColor="Black"
                       VerticalOptions="Center"
                       FontSize="Large"/>
              </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Le plus proche que j'ai eu est de changer la BackgroundColor dans ViewCell.Tapped, puis de la remettre dans View.OnAppearing()(ViewCell.Appearing est cassé)}, mais _, mais change l'arrière-plan lorsque le doigt est levé, plutôt que lorsqu'il est appuyé.

Je teste sur Android mais préférerais une solution multi-plateforme.

listviewxamarinxamarin.forms
11
BlueRaja - Danny Pflughoeft

Vérifiez votre message sur le forum Xamarin pour mes commentaires. XFGloss est une solution d’arrivée facile pour vous. C'est un add-on open source gratuit pour Xamarin.Forms. La source est disponible sur GitHub . Il existe également un package NuGet available. Il vous permet d'attribuer une valeur BackgroundColor aux contrôles de cellule XF standard (TextCell, EntryCell, etc.). Plusieurs nouvelles propriétés ont également été ajoutées par XFGloss.

Si vous préférez corriger votre implémentation existante, vous pouvez consulter les modifications apportées pour prendre en charge le retour visuel de ce code commit .

9
Tommy Baggett

Une fois la couleur d'arrière-plan définie, vous ne pourrez plus voir la couleur de l'élément sélectionné ni le retour d'information Haptic, à moins que vous ne créiez un rendu personnalisé sur chaque plate-forme.  

Voici le travail que vous pouvez mettre en œuvre entre plates-formes et sur MVVM à l'aide de Liaisons pour définir la couleur de l'élément sélectionné: 

  1. Lier une propriété à la SelectedItem de ListView. 
  2. Liez la couleur d'arrière-plan de votre StackLayout à une propriété auto et définissez la valeur "#CCCCCC" si l'élément n'est pas sélectionné, sinon une autre couleur. 
  3. Vous devez vous abonner à la propriété SelectedMyItem dans la classe MyItem et appeler la propriété OnPropertyChanged de la propriété BackgroundColor. Pour cela, vous pouvez créer un événement et vous abonner, ou tout autre élément avec lequel vous vous sentez à l'aise .(ceci n'est pas implémenté dans le pseudo-code exemple fourni ci-dessous)} 

ViewModel: 

public class MyViewModel : IMyViewModel
{
    public ObserveableCollection<MyItem> Items { get; set; }
    public MyItem SelectedMyItem { get; set; }
}

Classe d'élément de liste: 

public class MyItem 
{
    private readonly IMyViewModel _myViewModel;

    public MyItem(IMyViewModel myViewModel)
    {
        _myViewModel = myViewModel;
    }

    public string Name { get; set; }
    public Color BackgroundColor => _myViewModel.SelectedMyItem == this 
                                    ? Color.Red : Color.FromHex("CCCCCC");        
}

XAML: 

<ListView x:Name="list"
           IsGroupingEnabled="True"
           GroupDisplayBinding="{Binding Key}"
           GroupShortNameBinding="{Binding Key}"
           HasUnevenRows="True"
           ItemsSource="{Binding Items}"
           SelectedItem="{Binding SelectedMyItem}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
              <StackLayout VerticalOptions="FillAndExpand"
                           Padding="5, 20"
                           BackgroundColor="{Binding BackgroundColor}">
                   <StackLayout.GestureRecognizers>
                       <TapGestureRecognizer Tapped="OnItemTapped" />
                   </StackLayout.GestureRecognizers>
                <Label Text="{Binding Name}"
                       TextColor="Black"
                       VerticalOptions="Center"
                       FontSize="Large"/>
              </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Les retours haptiques contournent: 

Habituellement, une touche est 200-300ms. Une fois que vous avez appuyé sur un élément, vous pouvez modifier la couleur de l'arrière-plan pour cette durée, puis définir la couleur d'origine. 

public async void OnItemTapped(object sender, EventArgs args) 
{
   BackgroundColor = Color.Orange; //touch color
   await Task.Delay(250);          //time to show new color
   BackgroundColor = Color.Red;    //original color
}

Vous pouvez même améliorer cela davantage en essayant d'incorporer animations , peut-être le FadeTo pour changer les couleurs. 

2
Rohit Vipin Mathews

Vous pouvez simplement l'utiliser dans votre classe héritée Viewcell ,

this.Tapped += ViewCell_Tapped; // En tapotant dans votre cellule de vue, vous pouvez obtenir un résultat haptique. 

async privé void ViewCell_Tapped (expéditeur d'objet, EventArgs e) { this.View.BackgroundColor = Color.Gray; wait Task.Delay (10);
this.View.BackgroundColor = Color.White; }

Cela fonctionne pour moi.

0
Yogeshwaran