Fala, galera! Beleza?
Há um tempo eu publiquei um artigo chamado “5 Dicas para Xamarin.Android“, ajudando a fazer algumas customizações interessantes no Android – inclusive se você utiliza Xamarin.Forms.
Hoje trago cinco dicas para Xamarin.iOS, muito úteis em algumas situações ou para turbinar o projeto.
Sem mais delongas, vamos à elas!
1. Disclosure
Não, isso não é um prato francês. Disclosure é aquela “setinha” (indicador) que demonstra em um Listview que se o item for tocado, uma navegação é feita:
Como é uma particularidade do iOS, não existe no Xamarin.Forms. Porém, graças a um custom renderer, é extremamente simples de implementar. Primeiro criaremos o custom renderer StandardViewCellRenderer:
using Xamarin.Forms;
using Expo.iOS;
using Xamarin.Forms.Platform.iOS;
[assembly: ExportRenderer(typeof(ViewCell), typeof(StandardViewCellRenderer))]
namespace Expo.iOS
{
public class StandardViewCellRenderer : ViewCellRenderer
{
public override UIKit.UITableViewCell GetCell (Cell item, UIKit.UITableViewCell reusableCell, UIKit.UITableView tv)
{
var cell = base.GetCell (item, reusableCell, tv);
switch (item.StyleId) {
case "none":
cell.Accessory = UIKit.UITableViewCellAccessory.None;
break;
case "checkmark":
cell.Accessory = UIKit.UITableViewCellAccessory.Checkmark;
break;
case "detail-button":
cell.Accessory = UIKit.UITableViewCellAccessory.DetailButton;
break;
case "detail-disclosure-button":
cell.Accessory = UIKit.UITableViewCellAccessory.DetailDisclosureButton;
break;
case "disclosure":
default:
cell.Accessory = UIKit.UITableViewCellAccessory.DisclosureIndicator;
break;
}
return cell;
}
}
}
Certo, em seguida, em nossa ViewCell adicionaremos o StyleId: <ViewCell StyleId=”disclosure”>:
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:DicasXamariniOS"
x:Class="DicasXamariniOS.MainPage" Padding="0,40,0,0">
<StackLayout>
<ListView x:Name="lvwUsers"
SeparatorVisibility="Default"
ItemsSource="{Binding Users}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell StyleId="disclosure">
<StackLayout Orientation="Vertical" Padding="20,0,20,0">
<Label Text="{Binding Name}" FontSize="17" ></Label>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>
Pronto! Vejam só:
Com esse mesmo renderer temos outros StyleIds como, por exemplo, checkmark.
Muito útil, não?
2. ViewCell SelectionStyle
Mudar a cor selecionada de um ListView não é novidade para ninguém. Porém, você já quis deixar transparente (ou sem cor, no caso)? Existe um custom renderer que é uma mão na roda para isso:
[assembly: ExportRenderer(typeof(ViewCell), typeof(ViewCellTransparent))]
namespace DicasXamariniOS.iOS
{
public class ViewCellTransparent : ViewCellRenderer
{
public override UITableViewCell GetCell(Cell item, UITableViewCell reusableCell, UITableView tv)
{
var cell = base.GetCell(item, reusableCell, tv);
if (cell != null)
{
// Disable native cell selection color style - set as *Transparent*
cell.SelectionStyle = UITableViewCellSelectionStyle.None;
}
return cell;
}
}
}
Pronto, se você executar vai ver que não existe mais cor quando o usuário toca na celula.
Warning: Se quiser utilizar esse custom renderer com o anterior, recomendo que junte os dois, pois um acaba sobrepondo o outro.
3 . Alterar a Status Bar
É possível customizar a status bar do seu app para que ela pareça fazer parte do mesmo, muitas vezes para combinar com o tema, fundo e etc. Por padrão ela possui um texto preto, mas podemos deixá-la mais bonita.
Para isso, basta ir no AppDelegate e inserir as linhas:
UIApplication.SharedApplication.SetStatusBarStyle(UIStatusBarStyle.LightContent, false);
UIApplication.SharedApplication.SetStatusBarHidden(false, false);
E no Info.Plist, as chaves:
Então temos:
O UIStatusBarStyle possui diversas opções. Basta escolher a que melhor atende ao tema do seu app:
4. Alterando as cores dos ícones selecionados da TabBar:
Por padrão, os ícones selecionados na TabBar são azuis. Porém, é possível alterá-los com uma linha simples no APPDelegate.cs:
UITabBar.Appearance.TintColor = UIColor.FromRGB(224, 111, 35);
Easy:
5. Removendo linhas extras do seu ListView
Por fim, um “hack”, caso você queira remover aquelas linhas extras do seu ListView quando o Forms roda no iOS. Basta definir o valor do Footer como vazio:
Então:
São dicas simples, mas que podem quebrar um galho.
Claro que para algumas dessas dicas existem outras formas de se fazer – apenas estou mostrando uma maneira simples.
Caso queira baixar o código utilizado no exemplo, clique aqui.
Quer ver outros artigos sobre Xamarin? Acesse este link.
Espero ter ajudado. Aquele abraço!