Search code examples
androidlistviewandroid-imageviewonclicklisteneronitemclicklistener

how to get the position of a image in a listview and toggle if another image is clicked in the listview


i have listview with an image and when the image is clicked it fades out and turns back to normal when the same image is clicked again by using the following code of my Adapter:

imageView.setTag(position);


if(currentWord.isFlag)
    {

        imageView.setAlpha(60);
                }
    else
    {
        imageView.setAlpha(255);
                }

the code is working fine. when a user clicks an image in the listview it fades out imageView.setAlpha(60); and when the user clicks on the same image it turns to normal. imageView.setAlpha(100);

my WordAdapter is as follows :

public class WordAdapter extends ArrayAdapter<Word>  {

/** Resource ID for the background color for this list of words */
private int mColorResourceId;

/**
 * Create a new {@link WordAdapter} object.
 *
 * @param context is the current context (i.e. Activity) that the adapter is being created in.
 * @param words is the list of {@link Word}s to be displayed.
 * @param colorResourceId is the resource ID for the background color for this list of words
 */
public WordAdapter(Context context, ArrayList<Word> words, int colorResourceId) {
    super(context, 0, words);
    mColorResourceId = colorResourceId;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    // Check if an existing view is being reused, otherwise inflate the view
    View listItemView = convertView;
    if (listItemView == null) {
        listItemView = LayoutInflater.from(getContext()).inflate(
                R.layout.list_item, parent, false);
    }

    // Get the {@link Word} object located at this position in the list
    final Word currentWord = getItem(position);

    // Find the TextView in the list_item.xml layout with the ID miwok_text_view.
    TextView miwokTextView = (TextView) listItemView.findViewById(R.id.miwok_text_view);
    // Get the Miwok translation from the currentWord object and set this text on
    // the Miwok TextView.
    miwokTextView.setText(currentWord.getMiwokTranslationId());

    // Find the TextView in the list_item.xml layout with the ID default_text_view.
    TextView defaultTextView = (TextView) listItemView.findViewById(R.id.default_text_view);
    // Get the default translation from the currentWord object and set this text on
    // the default TextView.
    defaultTextView.setText(currentWord.getDefaultTranslationId());

    // Find the ImageView in the list_item.xml layout with the ID image.
    final ImageView imageView = (ImageView) listItemView.findViewById(R.id.image);

    // Check if an image is provided for this word or not
    if (currentWord.hasImage()) {
        // If an image is available, display the provided image based on the resource ID
        imageView.setImageResource(currentWord.getImageResourceId());
        // Make sure the view is visible
        imageView.setVisibility(View.VISIBLE);
    } else {
        // Otherwise hide the ImageView (set visibility to GONE)
        imageView.setVisibility(View.GONE);
    }

// add a tag to determine the position of the view, when the view is clicked. imageView.setTag(position);

    // Set the theme color for the list item
    View textContainer = listItemView.findViewById(R.id.text_container);
    // Find the color that the resource ID maps to
    int color = ContextCompat.getColor(getContext(), mColorResourceId);
    // Set the background color of the text container View
    textContainer.setBackgroundColor(color);

    // Return the whole list item layout (containing 2 TextViews) so that it can be shown in
    // the ListView.

    // ImageView imageView = (ImageView) listItemView.findViewById(R.id.list_item);


        imageView.setOnClickListener(new ImageView.OnClickListener() {
        @Override
        public void onClick(View view) {
            if(currentWord.isFlag){
                currentWord.isFlag = false;
            }else{
                currentWord.isFlag = true;
            }
            notifyDataSetChanged();
        }

    });

    if(currentWord.isFlag)
    {

        imageView.setAlpha(60);

    }
    else
    {
        imageView.setAlpha(255);

    }

    return listItemView;
}
}

the following is my Fragment class

public class FamilyFragment extends Fragment {

  /** to check whether Activity is Active */
static boolean isActive = true;

/** Stores the last selected position */
private int lastSelectedPosition = -1;

/** Handles playback of all the sound files */
private MediaPlayer mMediaPlayer;

/** Handles audio focus when playing a sound file */
private AudioManager mAudioManager;

// Create a list of words
private ArrayList<Word> words = new ArrayList<Word>();

WordAdapter adapter;


/**
 * This listener gets triggered whenever the audio focus changes
 * (i.e., we gain or lose audio focus because of another app or device).
 */
private AudioManager.OnAudioFocusChangeListener mOnAudioFocusChangeListener = new AudioManager.OnAudioFocusChangeListener() {


    @Override
    public void onAudioFocusChange(int focusChange) {

        if (focusChange == AudioManager.AUDIOFOCUS_LOSS_TRANSIENT ||
                focusChange == AudioManager.AUDIOFOCUS_LOSS_TRANSIENT_CAN_DUCK) {
            // The AUDIOFOCUS_LOSS_TRANSIENT case means that we've lost audio focus for a
            // short amount of time. The AUDIOFOCUS_LOSS_TRANSIENT_CAN_DUCK case means that
            // our app is allowed to continue playing sound but at a lower volume. We'll treat
            // both cases the same way because our app is playing short sound files.

            // Pause playback and reset player to the start of the file. That way, we can
            // play the word from the beginning when we resume playback.
            mMediaPlayer.pause();
            mMediaPlayer.seekTo(0);
        } else if (focusChange == AudioManager.AUDIOFOCUS_GAIN) {
            // The AUDIOFOCUS_GAIN case means we have regained focus and can resume playback.
            mMediaPlayer.start();

        } else if (focusChange == AudioManager.AUDIOFOCUS_LOSS) {
            // The AUDIOFOCUS_LOSS case means we've lost audio focus and
            // Stop playback and clean up resources

           releaseMediaPlayer();

        }
    }
};

/**
 * This listener gets triggered when the {@link MediaPlayer} has completed
 * playing the audio file.
 */
private MediaPlayer.OnCompletionListener mCompletionListener = new MediaPlayer.OnCompletionListener() {
    @Override
    public void onCompletion(MediaPlayer mediaPlayer) {


        if(lastSelectedPosition != -1){
            Word lastWord = words.get(lastSelectedPosition);
            lastWord.isPlaying = false;
            lastSelectedPosition = -1;
            adapter.notifyDataSetChanged();
        }
        // Now that the sound file has finished playing, release the media player resources.
            releaseMediaPlayer();

    }
};

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

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
  final  View rootView = inflater.inflate(R.layout.word_list, container, false);

    // Create and setup the {@link AudioManager} to request audio focus
    mAudioManager = (AudioManager) getActivity().getSystemService(Context.AUDIO_SERVICE);

    // Create a list of words

    words.add(new Word(R.string.family_father, R.string.miwok_family_father,
            R.drawable.family_father,R.string.miwok_family_father, R.raw.family_father));
    words.add(new Word(R.string.family_mother, R.string.miwok_family_mother,
            R.drawable.family_mother,R.string.miwok_family_mother, R.raw.family_mother));
    words.add(new Word(R.string.family_son, R.string.miwok_family_son,
            R.drawable.family_son, R.string.miwok_family_son, R.raw.family_son));
    words.add(new Word(R.string.family_daughter, R.string.miwok_family_daughter,
            R.drawable.family_daughter,R.string.miwok_family_daughter, R.raw.family_daughter));
    words.add(new Word(R.string.family_older_brother, R.string.miwok_family_older_brother,
            R.drawable.family_older_brother, R.string.miwok_family_older_brother, R.raw.family_older_brother));
    words.add(new Word(R.string.family_younger_brother, R.string.miwok_family_younger_brother,
            R.drawable.family_younger_brother, R.string.miwok_family_younger_brother, R.raw.family_younger_brother));
    words.add(new Word(R.string.family_older_sister, R.string.miwok_family_older_sister,
            R.drawable.family_older_sister,R.string.miwok_family_older_sister, R.raw.family_older_sister));
    words.add(new Word(R.string.family_younger_sister, R.string.miwok_family_younger_sister,
            R.drawable.family_younger_sister, R.string.miwok_family_younger_sister, R.raw.family_younger_sister));
    words.add(new Word(R.string.family_grandmother, R.string.miwok_family_grandmother,
            R.drawable.family_grandmother, R.string.miwok_family_grandmother, R.raw.family_grand_mother));
    words.add(new Word(R.string.family_grandfather, R.string.miwok_family_grandfather,
            R.drawable.family_grandfather, R.string.miwok_family_grandfather, R.raw.family_grand_father));

    // Create an {@link WordAdapter}, whose data source is a list of {@link Word}s. The
    // adapter knows how to create list items for each item in the list.
    adapter = new WordAdapter(getActivity(), words, R.color.category_family);

    // Find the {@link ListView} object in the view hierarchy of the {@link Activity}.
    // There should be a {@link ListView} with the view ID called list, which is declared in the
    // word_list.xml layout file.




    final ListView listView = (ListView) rootView.findViewById(R.id.list);


    // Make the {@link ListView} use the {@link WordAdapter} we created above, so that the
    // {@link ListView} will display list items for each {@link Word} in the list.
    listView.setAdapter(adapter);


   // Set a click listener to play the audio when the list item is clicked on
    listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {

        @Override
        public void onItemClick(AdapterView<?> adapterView, View view, int position, long l) {
            // Release the media player if it currently exists because we are about to
            // play a different sound file

          releaseMediaPlayer();

            // Get the {@link Word} object at the given position the user clicked on
            Word word = words.get(position);
            word.isPlaying = true;

            if(lastSelectedPosition != -1){
                Word lastWord = words.get(lastSelectedPosition);
                lastWord.isPlaying = false;

            }

            lastSelectedPosition = position;
            adapter.notifyDataSetChanged();


            // Request audio focus so in order to play the audio file. The app needs to play a
            // short audio file, so we will request audio focus with a short amount of time
            // with AUDIOFOCUS_GAIN_TRANSIENT.
            int result = mAudioManager.requestAudioFocus(mOnAudioFocusChangeListener,
                    AudioManager.STREAM_MUSIC, AudioManager.AUDIOFOCUS_GAIN_TRANSIENT);



            if (result == AudioManager.AUDIOFOCUS_REQUEST_GRANTED) {
                // We have audio focus now.

                      // Create and setup the {@link MediaPlayer} for the audio resource associated
                // with the current word
                mMediaPlayer = MediaPlayer.create(getActivity(), word.getAudioResourceId());


                // Start the audio file
                mMediaPlayer.start();
                word.isPlaying = true;
                adapter.notifyDataSetChanged();


               // Get the value of currentVolume
                int currentVolume = mAudioManager.getStreamVolume(AudioManager.STREAM_MUSIC);

                // If currentVolume is set to 0, show Toast
                if (currentVolume ==0){
                    Toast.makeText(getContext(), "Please Turn the Volume Up ", Toast.LENGTH_SHORT).show();
                }

                // Setup a listener on the media player, so that we can stop and release the
                // media player once the sound has finished playing.
                mMediaPlayer.setOnCompletionListener(mCompletionListener);

            }


        }
    });

    return rootView;
}


@Override
public void onStart() {
    super.onStart();
    isActive = true;
 }

@Override
public void onStop() {
    super.onStop();
    isActive = false;

     // When the activity is stopped, release the media player resources because we won't
    // be playing any more sounds.
    releaseMediaPlayer();

}

   /**
 * Clean up the media player by releasing its resources.
 */
private void releaseMediaPlayer() {
    // If the media player is not null, then it may be currently playing a sound.
    if (mMediaPlayer != null) {

                    // Regardless of the current state of the media player, release its resources
        // because we no longer need it.
        mMediaPlayer.release();


                  // Set the media player back to null. For our code, we've decided that
        // setting the media player to null is an easy way to tell that the media player
        // is not configured to play an audio file at the moment.
        mMediaPlayer = null;

        // Regardless of whether or not we were granted audio focus, abandon it. This also
        // unregisters the AudioFocusChangeListener so we don't get anymore callbacks.
        mAudioManager.abandonAudioFocus(mOnAudioFocusChangeListener);
    }
}
}

now my problem here is if the user clicks one image, it fades out.imageView.setAlpha(60); and when he clicks another image in the listview, it also fades out,imageView.setAlpha(60); but without turning back the previously clicked image (in the listview) back to normal.imageView.setAlpha(100);

how to get the desired result..


Solution

  • In your listener you must insert code:

            if(currentWord.isFlag){
                currentWord.isFlag = false;
                MyGlobal.flaggedPosition = -1;
            } else {
                if  (MyGlobal.flaggedPosition >=0) {
                    MyGlobal.adapter.getItem(MyGlobal.flaggedPosition).isFlag = false;
                }
                currentWord.isFlag = true;
                MyGlobal.flaggedPosition = position;
            }
    

    Here is the class you need to create:

    public final class MyGlobal {
        public static int flaggedPosition = -1;
        public static WordAdapter adapter;
    }