效果图
在gradle里导包 implementation 'com.android.support:design:28.0.0'
activity_main
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity">
<android.support.design.widget.TabLayout android:id="@+id/tablayout" style="@style/CategoryTab" android:background="@color/primary_color" android:layout_width="match_parent" android:layout_height="wrap_content"/>
<android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent"/>
</LinearLayout>
fragment<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.RecyclerView android:id="@+id/recycerview" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:drawSelectorOnTop="true"> </android.support.v7.widget.RecyclerView>
item
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:orientation="vertical" android:layout_height="wrap_content">
<LinearLayout android:id="@+id/layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center">
<ImageView android:id="@+id/image" android:layout_width="wrap_content" android:layout_height="wrap_content" tools:src="@drawable/color_black" />
<LinearLayout android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="2" android:gravity="center" android:orientation="vertical">
<TextView tools:text="one" android:id="@+id/text_english" android:textSize="16sp" android:layout_margin="10dp" android:textColor="#2B3D4D" android:layout_width="wrap_content" android:layout_height="wrap_content" />
<TextView tools:text="lutti" android:id="@+id/text_miwok" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="10dp" android:textSize="16sp" android:textColor="#2B3D4D"/>
</LinearLayout>
<ImageView android:id="@+id/audio" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:src="@drawable/ic_baseline_play_arrow_24px" /> </LinearLayout>
<View android:layout_below="@id/layout" android:layout_width="match_parent" android:layout_height="1dp" android:background="#dfdfdf" /></LinearLayout>
Word
package com.example.admin.miwok;
public class Word { private String word_english; private String word_miwok; private int imageId; private int audioId;
public String getWord_english(){ return word_english; }
public String getWord_miwok(){ return word_miwok; }
public int getImageId() { return imageId; }
public int getAudioId() { return audioId; }
public static class Builder{ private String word_english; private String word_miwok; private int imageId; private int audioId;
public Builder imageId(int imageId){ this.imageId=imageId; return this; }
public Builder(String word_english,String word_miwok,int audioId){ this.word_english=word_english; this.word_miwok=word_miwok; this.audioId=audioId; }
public Word builder(){ return new Word(this); } }
private Word(Builder builder){ this.word_english=builder.word_english; this.word_miwok=builder.word_miwok; this.imageId=builder.imageId; this.audioId=builder.audioId; }}
MainActivity
package com.example.admin.miwok;
import android.support.design.widget.TabLayout;import android.support.v4.view.ViewPager;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ViewPager viewPager = findViewById(R.id.viewpager); viewPager.setAdapter(new CategoryFragmentPagerAdapter(this,getSupportFragmentManager())); TabLayout tabLayout = findViewById(R.id.tablayout); tabLayout.setupWithViewPager(viewPager); }}
mAdapter
package com.example.admin.miwok;
import android.content.Context;import android.support.annotation.NonNull;import android.support.v7.widget.RecyclerView;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import android.widget.TextView;
import java.util.List;
public class mAdpater extends RecyclerView.Adapter<mAdpater.viewHolder> { private Context context; private List<Word> itemlist; private onAudioItemClickListener onAudioItemClick;
public mAdpater(Context context,List<Word> itemlist,onAudioItemClickListener onAudioItemClick){ this.context=context; this.itemlist=itemlist; this.onAudioItemClick=onAudioItemClick; }
@NonNull @Override public viewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) { View view=LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.item,viewGroup,false); viewHolder holder=new viewHolder(view); return holder; }
@Override public void onBindViewHolder(@NonNull viewHolder viewHolder, int i) { String word_miwok=itemlist.get(i).getWord_miwok(); String word_englist=itemlist.get(i).getWord_english(); int imageId=itemlist.get(i).getImageId();
viewHolder.textView_miwok.setText(word_miwok); viewHolder.textView_english.setText(word_englist); viewHolder.imageView.setImageResource(imageId);
}
@Override public int getItemCount() { return itemlist.size(); }
public class viewHolder extends RecyclerView.ViewHolder{ final TextView textView_miwok; final TextView textView_english; final ImageView imageView; final ImageView audioView;
public viewHolder(@NonNull View itemView) { super(itemView); textView_miwok=itemView.findViewById(R.id.text_miwok); textView_english=itemView.findViewById(R.id.text_english); imageView=itemView.findViewById(R.id.image); audioView=itemView.findViewById(R.id.audio); audioView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { onAudioItemClick.onClick(getAdapterPosition()); } });
} }
public interface onAudioItemClickListener{ void onClick(int position); }}
NumbersFragment
package com.example.admin.miwok;
import android.content.Context;import android.media.AudioManager;import android.media.MediaPlayer;import android.os.Bundle;import android.support.annotation.NonNull;import android.support.annotation.Nullable;import android.support.v4.app.Fragment;import android.support.v7.widget.LinearLayoutManager;import android.support.v7.widget.RecyclerView;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import java.util.ArrayList;import java.util.List;
public class NumbersFragment extends Fragment implements mAdpater.onAudioItemClickListener { private List<Word> itemlist; private AudioManager manager; private MediaPlayer player;
private MediaPlayer.OnCompletionListener listener=new MediaPlayer.OnCompletionListener() { @Override public void onCompletion(MediaPlayer mp) { releaseMediaPlaer(); } };
private AudioManager.OnAudioFocusChangeListener onAudioFocusChangeListener=new AudioManager.OnAudioFocusChangeListener() { @Override public void onAudioFocusChange(int focusChange) { if (focusChange==AudioManager.AUDIOFOCUS_GAIN){ player.start(); }else if (focusChange==AudioManager.AUDIOFOCUS_LOSS_TRANSIENT||focusChange==AudioManager.AUDIOFOCUS_LOSS_TRANSIENT_CAN_DUCK){ player.pause(); player.seekTo(0); }else if (focusChange==AudioManager.AUDIOFOCUS_LOSS){ releaseMediaPlaer(); } } };
@Nullable @Override public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view=inflater.inflate(R.layout.fragment,container,false); manager=(AudioManager) getActivity().getSystemService(Context.AUDIO_SERVICE); itemlist=new ArrayList<>();
itemlist.add(new Word.Builder("one", "lutti", R.raw.number_one) .imageId(R.drawable.number_one).builder()); itemlist.add(new Word.Builder("two", "otiiko", R.raw.number_two) .imageId(R.drawable.number_two).builder()); itemlist.add(new Word.Builder("three", "tolookosu", R.raw.number_three) .imageId(R.drawable.number_three).builder()); itemlist.add(new Word.Builder("four", "oyyisa", R.raw.number_four) .imageId( R.drawable.number_four).builder()); itemlist.add(new Word.Builder("five","massokka", R.raw.number_five) .imageId( R.drawable.number_five).builder()); itemlist.add(new Word.Builder("six", "temmokka", R.raw.number_six) .imageId(R.drawable.number_six).builder()); itemlist.add(new Word.Builder("seven", "kenekaku", R.raw.number_seven) .imageId( R.drawable.number_seven).builder()); itemlist.add(new Word.Builder("eight", "kawinta", R.raw.number_eight) .imageId(R.drawable.number_eight).builder()); itemlist.add(new Word.Builder("nine", "wo'e", R.raw.number_nine) .imageId(R.drawable.number_nine).builder()); itemlist.add(new Word.Builder("ten", "na'aacha", R.raw.number_ten) .imageId( R.drawable.number_ten).builder()); RecyclerView recyclerView=view.findViewById(R.id.recycerview); LinearLayoutManager linearLayoutManager=new LinearLayoutManager(getActivity()); recyclerView.setLayoutManager(linearLayoutManager); mAdpater adpater=new mAdpater(getActivity(),itemlist,this); recyclerView.setAdapter(adpater); return view;
}
@Override public void onClick(int position) { releaseMediaPlaer(); int result=manager.requestAudioFocus(onAudioFocusChangeListener,AudioManager.STREAM_MUSIC,AudioManager.AUDIOFOCUS_GAIN_TRANSIENT); if (result==AudioManager.AUDIOFOCUS_GAIN) {
player = MediaPlayer.create(getActivity(), itemlist.get(position).getAudioId()); player.start(); player.setOnCompletionListener(listener); }
}
@Override public void onStop() { super.onStop(); releaseMediaPlaer(); }
private void releaseMediaPlaer() { if (player != null) { player.release(); player = null; manager.abandonAudioFocus(onAudioFocusChangeListener); } }}
同理，其他几个fragment复制粘贴一下就行。 CategoryFragmentPagerAdapter
package com.example.admin.miwok;
import android.content.Context;import android.support.annotation.Nullable;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;
public class CategoryFragmentPagerAdapter extends FragmentPagerAdapter { private Context context; private static final int size=4; private static final int nuumber_fragment=0,family_fragment=1,colors_fragment=2,phrases_fragment=3;
public CategoryFragmentPagerAdapter(Context context ,FragmentManager manager){ super(manager); this.context=context; }
@Override public Fragment getItem(int position) { switch (position){ default:return new NumbersFragment(); case nuumber_fragment: return new NumbersFragment(); case family_fragment: return new FamilyFragment(); case colors_fragment: return new ColorsFragment(); case phrases_fragment: return new PhrasesFragment(); } }
@Override public int getCount() { return size; }
@Nullable @Override public CharSequence getPageTitle(int position) { final String[] pageTitle=context.getResources().getStringArray(R.array.pageTitle); return pageTitle[position]; }
}
github项目源码: https://github.com/NeoWu55/Android-Miwok