ItemSeparatorComponent - 回调每一行

时间:2017-05-07 11:59:38

标签: react-native

如何为每一行调用ItemSeparatorComponent FlatList道具,以便每行都可以自定义ListView道具。类似于renderSeparator支持弃用public class PageFragment_Bon extends Fragment implements View.OnClickListener{ public static final String ARG_PAGE = "ARG_PAGE"; private int mPage; private Button start, stop, replay; private MediaPlayer mediaPlayer; int [] filer = new int[18]; public static PageFragment_Bon newInstance(int page) { Bundle args = new Bundle(); args.putInt(ARG_PAGE, page); PageFragment_Bon fragment = new PageFragment_Bon(); fragment.setArguments(args); return fragment; } @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); mPage = getArguments().getInt(ARG_PAGE); } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_boenner, container, false); start = (Button) view.findViewById(R.id.start); start.setOnClickListener(this); stop = (Button) view.findViewById(R.id.stop); stop.setOnClickListener(this); replay = (Button) view.findViewById(R.id.replay); replay.setOnClickListener(this); filer[2] = R.raw.takbira; filer[4] = R.raw.alfatiha; filer[14] = R.raw.tashahhud; filer[15] = R.raw.salat; filer[16] = R.raw.assalam; if(filer[mPage] != 0){ start.setVisibility(View.VISIBLE); stop.setVisibility(View.VISIBLE); replay.setVisibility(View.VISIBLE); } return view; } @Override public void onPause() { super.onPause(); if(mediaPlayer != null) { mediaPlayer.stop(); mediaPlayer.reset(); mediaPlayer.release(); } } @Override public void onClick(View v) { if(mediaPlayer == null) mediaPlayer = MediaPlayer.create(getActivity().getBaseContext(), filer[mPage]);//add this line if(v == start){ try { mediaPlayer.start(); } catch (Exception e) { e.printStackTrace(); } } else if(v == stop){ mediaPlayer.pause(); } else if(v == replay){ mediaPlayer.seekTo(0); mediaPlayer.start(); } } @Override public void setUserVisibleHint(boolean isVisibleToUser) { super.setUserVisibleHint(isVisibleToUser); if(!isVisibleToUser){ if(mediaPlayer!=null) { if (mediaPlayer.isPlaying()) { try { mediaPlayer.pause(); mediaPlayer.seekTo(0); } catch (Exception e) { e.printStackTrace(); } } } } } } 的东西。

2 个答案:

答案 0 :(得分:6)

我有同样的要求,结果你也可以传递一个功能:

renderSeparator = ({leadingItem, section})=>{
  if (section.noSeparator || !leadingItem.noSeparator)
    return null;
  return <Separator />;
};

render(){
  return <SectionList
      renderSectionHeader={this.renderSectionHeader}
      sections={this.sections}
      renderItem={this.renderItem}
      ItemSeparatorComponent={this.renderSeparator}
  />;
}

答案 1 :(得分:0)

要显示ItemSeparatorComponent,请创建自己的分隔符或从react-native声明内部分隔符。分隔符需要放在flatList的正上方,以便它在正确的位置呈现。分隔符在列表的末尾和开头可见。下面是flatList中分隔符的代码:

render()
{
 return(
.
.
.
<SeparatorComponent />  //separator component
<FlatList
ItemSeparatorComponent={SeparatorComponent} // assign the separator here  
.
.
.
.
/>
)
}

干杯:)