1

Eu tenho uma ListView e dentro dela tenho um CarouselView com o nome de CarrosselDeImagens, mas no code behind eu não consigo acessar o CarouselView. Tipo assim: CarrosselDeImagens.ItemSource = listaImagens.

Como que eu poderia acessar o carouselview dentro de uma listview?

Código XAML:

<ListView x:Name="LstClassificados" HasUnevenRows="true" SeparatorVisibility="None">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <ViewCell.View>
                    <ContentView BackgroundColor="White">
                        <Frame BorderColor="#49c1ff" 
                               Margin="10" 
                               CornerRadius="10">
                            <StackLayout>
                                <Label Text="{Binding titulo}"
                                       FontSize="Medium"
                                       FontAttributes="Bold"
                                       VerticalTextAlignment="Center" 
                                       HorizontalTextAlignment="Center" 
                                       HorizontalOptions="Center" />

                                <control:CarouselViewControl Grid.Column="0"
                                                             Grid.Row="1"
                                                             x:Name="CarrosselDeImagens"                                                                         
                                                             ShowIndicators="True" 
                                                             Orientation="Horizontal" 
                                                             WidthRequest="300" 
                                                             HeightRequest="300">

                                    <control:CarouselViewControl.ItemTemplate>
                                        <DataTemplate>
                                            <Image Source="{Binding .}" />
                                        </DataTemplate>
                                    </control:CarouselViewControl.ItemTemplate>
                                </control:CarouselViewControl>
                            </StackLayout>
                        </Frame>
                    </ContentView>
                </ViewCell.View>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Modelo:

public class Classificado
{
    public int IdClassificado { get; set; }
    public string id { get; set; }
    public string titulo { get; set; }
    public string texto { get; set; }
    public string contato_email { get; set; }
    public string contato_tel { get; set; }
    public string contato_hora { get; set; }
    public string pago { get; set; }
    public string categ { get; set; }
    public string subcateg { get; set; }

    private string _img_link1;
    public string img_link1 { get { return "http://" + _img_link1; } set { _img_link1 = value; } }

    private string _img_link2;
    public string img_link2 { get { return "http://" + _img_link2; } set { _img_link2 = value; } }

    private string _img_link3;
    public string img_link3 { get { return "http://" + _img_link3; } set { _img_link3 = value; } }

    private string _img_link4;
    public string img_link4 { get { return "http://" + _img_link4; } set { _img_link4 = value; } }

    private string _img_link5;
    public string img_link5 { get { return "http://" + _img_link5; } set { _img_link5 = value; } }

    private string _img_link6;
    public string img_link6 { get { return "http://" + _img_link6; } set { _img_link6 = value; } }  
}

Método de carregar

private void CarregarCarrossel()
{
    var linkImagens = new List<string>
    {
        linkImagem.img_link1,
        linkImagem.img_link2,
        linkImagem.img_link3,
        linkImagem.img_link4,
        linkImagem.img_link5,
        linkImagem.img_link6
    };

    List<string> imagens = new List<string>();

    foreach (var link in linkImagens)
    {
        string flag = "http://";

        if (link != flag)
            imagens.Add(link);
    }

    CarrosselDeImagens.ItemsSource = imagens;
}
3
  • Ola Diego Rafael Souza, editei minha pergunta com o cóidgo XAML. Se voce poder me ar uma luz?
    – user114682
    Commented 29/05/2018 às 17:39
  • O meu modelo traz até seis strings com a url das imagens que estão em uma api com os dados dos classificados. Coloquei todo o código pra vc ver.
    – user114682
    Commented 29/05/2018 às 19:49
  • Está no code behind da página. Não tem viewmodel não estou usando MVVM por imperícia... Hehehe... Faz tempo q não mexo com Xamarin e muita coisa mudou e estou meio perdido... Hehehe... O código não está todo misturado como na pergunta é pq não consegui formatar direito.
    – user114682
    Commented 29/05/2018 às 21:23

1 Resposta 1

1

Para fazer funcionar o seu código, eu incluí uma nova propriedade Imagens no modelo de Classificado para prover a coleção que o Carrossel precisa como ItemsSource.

O modelo ficaria assim:

public class Classificado
{
    /* Suas outras propriedades */

    public IEnumerable<string> Imagens 
    {
        get
        {
            var ret = new List<string>();

            if(!string.IsNullOrWhiteSpace(img_link1))
                ret.Add(img_link1);

            if(!string.IsNullOrWhiteSpace(img_link2))
                ret.Add(img_link2);

            if(!string.IsNullOrWhiteSpace(img_link3))
                ret.Add(img_link3);

            if(!string.IsNullOrWhiteSpace(img_link4))
                ret.Add(img_link4);

            if(!string.IsNullOrWhiteSpace(img_link5))
                ret.Add(img_link5);

            if(!string.IsNullOrWhiteSpace(img_link6))
                ret.Add(img_link6);

            return ret;
        }
    }
}

Já no XAML da ListView, o ViewCell do DataTemplate ficaria assim:

<ViewCell>
    <ContentView BackgroundColor="White">
        <Frame BorderColor="#49c1ff" 
               Margin="10" 
               CornerRadius="10">
            <StackLayout>
                <Label Text="{Binding titulo}"
                       FontSize="Medium"
                       FontAttributes="Bold"
                       VerticalTextAlignment="Center" 
                       HorizontalTextAlignment="Center" 
                       HorizontalOptions="Center" />

                <control:CarouselViewControl Grid.Column="0"
                                             Grid.Row="1"
                                             ShowIndicators="True" 
                                             Orientation="Horizontal" 
                                             WidthRequest="300" 
                                             ItemsSource="{Binding Imagens}"
                                             HeightRequest="300">

                    <control:CarouselViewControl.ItemTemplate>
                        <DataTemplate>
                            <Image Source="{Binding .}" />
                        </DataTemplate>
                    </control:CarouselViewControl.ItemTemplate>
                </control:CarouselViewControl>
            </StackLayout>
        </Frame>
    </ContentView>
</ViewCell>

Observe que eu só adicionei a declaração de ItemsSource="{Binding Imagens}" no control:CarouselViewControl e removi o x:Name (você só teria acesso a ele dentro do contexto do próprio item, não no codebehid).

Notas

Eu não sei se vai funcionar bem ter dois componentes que lidam com o evendo de scroll aninhados. Isso não é recomendado e pode ser que você enfrente alguns problemas de usabilidade por causa disso.

Você já deve saber que o cenário ideal desse tipo de implementação seria aplicar o MVVM. Não hesite em fazê-lo tão logo quanto possível. Você será capaz de reaproveitar bastante código, reduzirá retrabalho, facilitará a manutenção e deixará seu código testável.

Espero que isso ajude.

Você deve fazer log-in para responder a esta pergunta.