search

Giphy / giphy-android-sdk

Home of the GIPHY SDK Android example app, along with Android SDK documentation, issue tracking, & release notes.
https://developers.giphy.com/
Mozilla Public License 2.0
91 stars 40 forks source link

Why am I unable to navigate from recents to gifs and gifs to recents in giphy grid view? #182

Closed sambhav2358 closed 2 years ago

sambhav2358 commented 2 years ago

🐛 Bug Report

Actually I am making an app to add gif support using the custom GiphyGridView. But I am facing one issue. I am unable to navigate from GIFs to Recents and from Recents to GIFs. I don't know why is it happening. Could you help me?

To Reproduce

This is the Java Class

package com.sk.telegram.Fragments;

import static android.view.View.GONE;
import static android.view.View.VISIBLE;

import android.os.Bundle;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

import android.text.Editable;
import android.text.TextWatcher;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Toast;

import com.giphy.sdk.core.models.Media;
import com.giphy.sdk.core.models.enums.MediaType;
import com.giphy.sdk.core.models.enums.RatingType;
import com.giphy.sdk.ui.Giphy;
import com.giphy.sdk.ui.pagination.GPHContent;
import com.giphy.sdk.ui.views.GPHGridCallback;
import com.sk.telegram.Interfaces.GifSelectionListener;
import com.sk.telegram.R;
import com.sk.telegram.databinding.FragmentPickGifBinding;

public class PickGifFragment extends Fragment {

    FragmentPickGifBinding b;
    String selectedMediaType = "gifs";
    GifSelectionListener gifSelectionListener;

    public PickGifFragment() {
        // Required empty public constructor
    }

    public PickGifFragment(GifSelectionListener listener) {
        gifSelectionListener = listener;
    }

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        Giphy.INSTANCE.configure(getContext(),"MY_API_KEY");
        b = FragmentPickGifBinding.inflate(getLayoutInflater());
        b.gifsGridView.setContent(GPHContent.Companion.getRecents());
        b.gifsGridView.setCallback(new GPHGridCallback() {
            @Override
            public void contentDidUpdate(int i) {

            }

            @Override
            public void didSelectMedia(@NonNull Media media) {
                gifSelectionListener.onGifSelected(media.getBitlyGifUrl());
            }
        });
        setListeners();
        b.gifsGridView.setShowViewOnGiphy(false);
        return b.getRoot();
    }

    private void setListeners() {
        b.gifs.setOnClickListener(v -> setSelectedMediaType("gifs"));
        b.stickers.setOnClickListener(v -> setSelectedMediaType("stick"));
        b.text.setOnClickListener(v -> setSelectedMediaType("text"));
        b.emoji.setOnClickListener(v -> setSelectedMediaType("emoji"));
        b.recents.setOnClickListener(v -> setSelectedMediaType("recents"));
        b.searchQuery.addTextChangedListener(new TextWatcher() {
            @Override public void beforeTextChanged(CharSequence s, int start, int count, int after) {}
            @Override public void afterTextChanged(Editable s) {}
            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                int visibility = s.toString().trim().isEmpty() ? VISIBLE : GONE;
                b.recents.setVisibility(visibility);
                b.view2.setVisibility(visibility);
                b.emoji.setVisibility(visibility);
                b.view.setVisibility(visibility);
                if (s.toString().trim().isEmpty()) {
                    setSelectedMediaType(selectedMediaType);
                    return;
                }
                setSelectedSearchMediaType(selectedMediaType,s.toString());
            }
        });
    }

    private void setSelectedMediaType(String type){
        selectedMediaType = type;
        switch (type){
            case "gifs":
                b.gifsGridView.setContent(GPHContent.Companion.getTrendingGifs());
                b.gifs.setBackgroundResource(R.drawable.gif_item_selected);
                b.stickers.setBackgroundResource(R.drawable.gif_item_normal);
                b.emoji.setBackgroundResource(R.drawable.gif_item_normal);
                b.text.setBackgroundResource(R.drawable.gif_item_normal);
                b.recents.setBackgroundResource(R.drawable.gif_item_normal);
                if (!b.searchQuery.getText().toString().trim().isEmpty()) setSelectedSearchMediaType(selectedMediaType,b.searchQuery.getText().toString().trim());
                break;
            case "stick":
                b.gifsGridView.setContent(GPHContent.Companion.getTrendingStickers());
                b.gifs.setBackgroundResource(R.drawable.gif_item_normal);
                b.stickers.setBackgroundResource(R.drawable.gif_item_selected);
                b.emoji.setBackgroundResource(R.drawable.gif_item_normal);
                b.text.setBackgroundResource(R.drawable.gif_item_normal);
                b.recents.setBackgroundResource(R.drawable.gif_item_normal);
                if (!b.searchQuery.getText().toString().trim().isEmpty()) setSelectedSearchMediaType(selectedMediaType,b.searchQuery.getText().toString().trim());
                break;
            case "text":
                b.gifsGridView.setContent(GPHContent.Companion.getTrendingText());
                b.gifs.setBackgroundResource(R.drawable.gif_item_normal);
                b.stickers.setBackgroundResource(R.drawable.gif_item_normal);
                b.emoji.setBackgroundResource(R.drawable.gif_item_normal);
                b.text.setBackgroundResource(R.drawable.gif_item_selected);
                b.recents.setBackgroundResource(R.drawable.gif_item_normal);
                if (!b.searchQuery.getText().toString().trim().isEmpty()) setSelectedSearchMediaType(selectedMediaType,b.searchQuery.getText().toString().trim());
                break;
            case "emoji":
                b.gifsGridView.setContent(GPHContent.Companion.getEmoji());
                b.gifs.setBackgroundResource(R.drawable.gif_item_normal);
                b.stickers.setBackgroundResource(R.drawable.gif_item_normal);
                b.emoji.setBackgroundResource(R.drawable.gif_item_selected);
                b.text.setBackgroundResource(R.drawable.gif_item_normal);
                b.recents.setBackgroundResource(R.drawable.gif_item_normal);
                if (!b.searchQuery.getText().toString().trim().isEmpty()) setSelectedSearchMediaType(selectedMediaType,b.searchQuery.getText().toString().trim());
                break;
            case "recents" :
                b.gifsGridView.setContent(GPHContent.Companion.getRecents());
                b.gifs.setBackgroundResource(R.drawable.gif_item_normal);
                b.stickers.setBackgroundResource(R.drawable.gif_item_normal);
                b.emoji.setBackgroundResource(R.drawable.gif_item_normal);
                b.text.setBackgroundResource(R.drawable.gif_item_normal);
                b.recents.setBackgroundResource(R.drawable.gif_item_selected);
                if (!b.searchQuery.getText().toString().trim().isEmpty()) setSelectedSearchMediaType(selectedMediaType,b.searchQuery.getText().toString().trim());
                break;
        }
    }

    private void setSelectedSearchMediaType(String type,String query){
        selectedMediaType = type;
        switch (type){
            case "gifs":
                b.gifsGridView.setContent(GPHContent.Companion.searchQuery(query,MediaType.gif,RatingType.pg13));
                b.gifs.setBackgroundResource(R.drawable.gif_item_selected);
                b.stickers.setBackgroundResource(R.drawable.gif_item_normal);
                b.emoji.setBackgroundResource(R.drawable.gif_item_normal);
                b.text.setBackgroundResource(R.drawable.gif_item_normal);
                break;
            case "stick":
                b.gifsGridView.setContent(GPHContent.Companion.searchQuery(query,MediaType.sticker,RatingType.pg13));
                b.gifs.setBackgroundResource(R.drawable.gif_item_normal);
                b.stickers.setBackgroundResource(R.drawable.gif_item_selected);
                b.emoji.setBackgroundResource(R.drawable.gif_item_normal);
                b.text.setBackgroundResource(R.drawable.gif_item_normal);
                break;
            case "text":
                b.gifsGridView.setContent(GPHContent.Companion.searchQuery(query,MediaType.text,RatingType.pg13));
                b.gifs.setBackgroundResource(R.drawable.gif_item_normal);
                b.stickers.setBackgroundResource(R.drawable.gif_item_normal);
                b.emoji.setBackgroundResource(R.drawable.gif_item_normal);
                b.text.setBackgroundResource(R.drawable.gif_item_selected);
                break;
            case "emoji":
                b.gifsGridView.setContent(GPHContent.Companion.searchQuery(query,MediaType.emoji,RatingType.pg13));
                b.gifs.setBackgroundResource(R.drawable.gif_item_normal);
                b.stickers.setBackgroundResource(R.drawable.gif_item_normal);
                b.emoji.setBackgroundResource(R.drawable.gif_item_selected);
                b.text.setBackgroundResource(R.drawable.gif_item_normal);
                break;
        }
    }

    public void setGifSelectionListener(GifSelectionListener gifSelectionListener){
        this.gifSelectionListener = gifSelectionListener;
    }
}

Now this is my XML class

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="@dimen/_200sdp"
    android:orientation="vertical"
    tools:context=".Fragments.PickGifFragment">

        <EditText
            android:id="@+id/searchQuery"
            android:layout_width="match_parent"
            android:layout_marginHorizontal="@dimen/_7sdp"
            android:layout_height="wrap_content"
            android:background="@drawable/rounded_gray_bg"
            android:hint="Search Giphy"
            android:textColor="@color/black"
            android:textColorHint="#AAAAAA"
            android:textSize="@dimen/_10sdp"
            tools:ignore="Autofill,HardcodedText,TextFields"
            android:paddingHorizontal="@dimen/_9sdp"
            android:paddingVertical="@dimen/_7sdp"
            android:layout_marginTop="@dimen/_10sdp"
            android:enabled="true"
            android:textCursorDrawable="@drawable/cursor"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginHorizontal="@dimen/_7sdp"
        android:layout_marginTop="@dimen/_10sdp">

        <TextView
            android:id="@+id/recents"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginHorizontal="@dimen/_5sdp"
            android:background="@drawable/gif_item_selected"
            android:gravity="center"
            android:paddingHorizontal="@dimen/_11sdp"
            android:paddingVertical="@dimen/_5sdp"
            android:text="Recents"
            android:textColor="#525252"
            android:textSize="@dimen/_10sdp"
            android:textStyle="bold"
            tools:ignore="HardcodedText" />

        <View
            android:id="@+id/view2"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/gifs"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginHorizontal="@dimen/_5sdp"
            android:background="@drawable/gif_item_normal"
            android:gravity="center"
            android:paddingHorizontal="@dimen/_11sdp"
            android:paddingVertical="@dimen/_5sdp"
            android:text="GIFs"
            android:textColor="#525252"
            android:textSize="@dimen/_10sdp"
            android:textStyle="bold"
            tools:ignore="HardcodedText" />

        <View
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/stickers"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginHorizontal="@dimen/_5sdp"
            android:background="@drawable/gif_item_normal"
            android:gravity="center"
            android:paddingHorizontal="@dimen/_11sdp"
            android:paddingVertical="@dimen/_5sdp"
            android:text="Stickers"
            android:textColor="#525252"
            android:textSize="@dimen/_10sdp"
            android:textStyle="bold"
            tools:ignore="HardcodedText" />

        <View
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginHorizontal="@dimen/_5sdp"
            android:background="@drawable/gif_item_normal"
            android:gravity="center"
            android:paddingHorizontal="@dimen/_11sdp"
            android:paddingVertical="@dimen/_5sdp"
            android:text="Text"
            android:textColor="#525252"
            android:textSize="@dimen/_10sdp"
            android:textStyle="bold"
            tools:ignore="HardcodedText" />

        <View
            android:id="@+id/view"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1" />

        <TextView
            android:id="@+id/emoji"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginHorizontal="@dimen/_5sdp"
            android:background="@drawable/gif_item_normal"
            android:gravity="center"
            android:paddingHorizontal="@dimen/_11sdp"
            android:paddingVertical="@dimen/_5sdp"
            android:text="Emoji"
            android:textColor="#525252"
            android:textSize="@dimen/_10sdp"
            android:textStyle="bold"
            tools:ignore="HardcodedText" />

    </LinearLayout>

    <com.giphy.sdk.ui.views.GiphyGridView
        android:id="@+id/gifsGridView"
        android:layout_width="match_parent"
        android:layout_height="@dimen/_100sdp"
        android:layout_marginTop="@dimen/_10sdp"
        app:gphCellPadding="12dp"
        app:gphDirection="vertical"
        app:gphShowCheckeredBackground="false"
        app:gphSpanCount="3" />

</LinearLayout>

Expected behavior

I want to change the gif content of click of every button.

Actual Behavior

You can see the video below to find out what I exactly am trying to say.

https://user-images.githubusercontent.com/97180951/154249075-303a7dfd-ff79-4a09-9b59-b8d570e4c2c8.mp4

Your Environment

ALexanderLonsky commented 2 years ago

@sambhav2358 it may be a bug with recents, but you can fix it in this way:

private void setSelectedMediaType(String type){
        binding.gifsGridView.setContent(null);
        switch (type){
            ...
sambhav2358 commented 2 years ago

Ok. Let me have a try. And please try to resolve asap. It did not occur yesterday but something wrong today

sambhav2358 commented 2 years ago

Thanks. It worked. You are best @ALexanderLonsky