Quantcast
Channel: Xamarin.Forms — Xamarin Community Forums
Viewing all articles
Browse latest Browse all 76418

Customize Cells/ListView on Xamarin.Forms via Custom Render

$
0
0

Hello everyone!
I have a native(Xamarin.Forms) listview. My data context have 3 property,like :

    public class MyDataContext :
    {
      public string Name {get;set;}
      public string ImageName {get;set;}
      public bool isAvailable {get;set;}
    }  

Where Name is a property for textLabel , ImageName imagesource for ImageControl and isAvailable some kind a condition for the cell(true - cell is active,other wise Cell have another opacity/background and is not clickable,also will appear an image(in right corner)that will show image "locked" !).

My listview at current moment :

 public class MyListView: ListView
        {
            public MyListView()
            {
                ItemTemplate = new DataTemplate(()=>
                {
                    BackgroundColor = Color.FromHex("#f2f0e9");
                        var _Label = new Label() { FontSize = 13, TextColor = Color.FromHex("#979797")};
                    _Label.SetBinding(Label.TextProperty,"Name");

                    RowHeight = 69;

                     var _Img = new Image(){ WidthRequest = 35, HeightRequest = 42};
                    _Img.SetBinding(Image.SourceProperty,"ImageName");

                        return new ViewCell 
                        {
                            View = new StackLayout
                                {
                                    Orientation = StackOrientation.Horizontal,
                                    Padding = 10,
                                    Children = 
                                        {
                                            _Img,
                                            new StackLayout
                                            {
                                                Padding = 10,
                                                VerticalOptions = LayoutOptions.Center,
                                                Spacing = 0,
                                                Children = 
                                                    {
                                                       _Label,
                                                    }
                                                }
                                        }
                                    }
                        };

                });
            }
        }
    }  

For some reason i need to customize (both platforms iOs/Android) :

  • Divider of cell(need to implement some custom color and size,like on picture) enter image description here

  • Cells disabling(similiar to property isEnabled) with another opacity/background of cell(and her controls label/image etc) :enter image description here

How i can achieve that?
Also tried(that snippet) to draw a line on custom render(for my custom divider,but no succes)

    var borderLayer = new CALayer();
         borderLayer.Frame = new CoreGraphics.CGRect(0f, this.Frame.Height - 1, this.Frame.Width, 1f);
         borderLayer.BorderColor = Color.White.ToCGColor();
         this.Control.Layer.AddSublayer(borderLayer);

Any help will be appreciated,thanks!
PS Sorry for my eng. skills!


Viewing all articles
Browse latest Browse all 76418

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>