Android水平圖像列表，每個關閉按鈕

Question

我正在開發一個應用程序，其中我有一個查看傳呼機與兩個片段。在第二個片段中，我想要顯示從相機捕獲的圖像列表或從圖庫中選擇一個一個。因此，在選擇或捕捉每個圖像後，圖像列表會增加。

我能夠捕捉圖像或從點擊按鈕，在片段二選擇畫廊。每次我這樣做，我保存圖像在內部存儲和數組列表中的路徑。

我在圖像視圖中顯示了路徑的數組列表中的所有圖像，並且每個圖像上的關閉按鈕水平滾動。此外，關閉功能是在片段二，因爲列表是在我必須刪除路徑的片段。

因此，爲此，我使用了堆棧上最高的投票答案。鏈接是：

https://stackoverflow.com/questions/34674576/how-to-show-images-with-horizontal-scrolling-android 

現在需要的是：我需要在具有關閉按鈕的圖像底部顯示的頁面或項目指標網點，使用戶可以知道哪個圖像或頁面，他是。

下面是我需要開發的圖像。

如何做到這一點我不能夠理解。請指導我。我在這方面投入了很多時間。

Answer 1

我已經試過這樣並實現了它。

這裏是fragment class：

public class DisplayImageFragment extends BaseFragment implements ViewPager.OnPageChangeListener { 

    private RadioGroup mIndicators; 
    private ViewPager mPager; 
    private List<Image> sliderItems; 
    private Bundle bundle; 

    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { 
     View view = inflater.inflate(R.layout.display_image_fragment, container, false); 
     mIndicators = (RadioGroup) getView().findViewById(R.id.page_indicator); 
     mPager = (ViewPager) getView().findViewById(R.id.viewPager); 

     return view; 
    } 

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

     mPager.setOnPageChangeListener(this); 

     this.bundle = getArguments(); 
     if (bundle != null) { 
      sliderItems = bundle.getParcelableArrayList(IMAGES_LIST); 
     } 
     setUpRadioIndicators(sliderItems); 

     // build pager adapter 
     ViewPagerAdapter adapter = (ViewPagerAdapter) mPager.getAdapter(); 

     if (adapter != null) { 
      adapter.notifyPagerAdapter(sliderItems); 
     } else { 
      adapter = new ViewPagerAdapter(getContext(), sliderItems); 
      mPager.setAdapter(adapter); 
     } 
    } 

    private void setUpRadioIndicators(List<Image> sliderItems) { 
     mIndicators.removeAllViews(); 

     for (int i = 0; i < sliderItems.size(); i++) { 
      mIndicators.addView(getIndicator(i)); 
     } 

     // default item 
     if (sliderItems.size() > 0) { 
      ((RadioButton) mIndicators.getChildAt(0)).setChecked(true); 
     } 
    } 

    private RadioButton getIndicator(int position) { 
     RadioButton radioButton = new RadioButton(getContext()); 
     radioButton.setButtonDrawable(null); 
     radioButton.setId(position); 

     int btnSize = (int) getResources().getDimension(R.dimen.radio_drawable_size); 
     RadioGroup.LayoutParams params = new RadioGroup.LayoutParams(btnSize, btnSize); 
     params.setMargins(5, 0, 5, 0); 
     radioButton.setLayoutParams(params); 

     radioButton.setBackgroundDrawable(getResources() 
       .getDrawable(R.drawable.slider_indicator_selector)); 

     return radioButton; 
    } 

    @Override 
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 
     ((RadioButton) mIndicators.getChildAt(position)).setChecked(true); 
    } 

    @Override 
    public void onPageSelected(int position) { 
    } 

    @Override 
    public void onPageScrollStateChanged(int state) { 
    }} 

這裏是display_image_fragment.xml

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/viewPager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" /> 

    <RadioGroup 
     android:id="@+id/page_indicator" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_centerHorizontal="true" 
     android:layout_marginBottom="10dp" 
     android:orientation="horizontal" /> 

    </RelativeLayout> 

這裏是slider_indicator_selected.xml：

<item android:drawable="@drawable/slider_indicator_selected" 
     android:state_pressed="true"/> 

    <item android:drawable="@drawable/slider_indicator_selected" 
     android:state_checked="true"/> 

    <item android:drawable="@drawable/slider_indicator_selected" 
     android:state_focused="true" /> 

    <item android:drawable="@drawable/slider_indicator_unselected" /> 

</selector> 

Answer 2

我已經實現演示，可以幫助您。 你可以通過下面的鏈接。 Demo