2017-04-14 56 views
0

全片段佈局:Fragment layout如何在Horizo​​ntalGridView中設置水平間距?

我想意見分開所以就卡之間的水平突破15dp,但現在它看起來像這樣:Overlapped views

我已經嘗試添加機器人:horizo​​ntalSpacing (就像我在常規GridView中那樣做)屬性到XML,但沒有任何事情發生。從LayoutManager使用childrenOffsetHorizo​​ntal也沒有按預期給出結果。

這裏是我的片段代碼:

public class TvDetailsFragment extends Fragment { 

private HorizontalGridView gridView; 
private SeasonsListAdapter seasonsListAdapter; 

public TvDetailsFragment(){ 

} 

@Override 
public View onCreateView(LayoutInflater inflater, ViewGroup container, 
         Bundle savedInstanceState) { 

    // Get the arguments from the ShowDetailsActivity. 
    Bundle args = getArguments(); 
    View rootView = inflater.inflate(R.layout.fragment_tv_details, container, false); 
    gridView = (HorizontalGridView)rootView. 
      findViewById(R.id.tv_details_seasons_gridview); 
    gridView.setLayoutManager(new LinearLayoutManager(getActivity(), LinearLayoutManager.HORIZONTAL, false)); 
    gridView.getLayoutManager().set 

    FetchTvDetailsById fetchDetails = new FetchTvDetailsById(getContext()); 
    fetchDetails.execute(args.getString("SHOW_ID")); 

    return rootView; 
} 

public void populateView(TvClass tvDetails) { 

    Activity mActivity = getActivity(); 

    ImageView imageView = (ImageView)mActivity.findViewById(R.id.tv_details_imageview); 
    Picasso.with(mActivity).load(tvDetails.getShowPosterLink()) 
      .fit() 
      .into(imageView); 

    TextView titleView = (TextView) mActivity.findViewById(R.id.tv_details_title_textview); 
    titleView.setText(Html.fromHtml("<b>" + "Original title: " + "</b> <br>" 
      + tvDetails.getShowOriginalTitle())); 

    TextView dateView = (TextView) mActivity.findViewById(R.id.tv_details_date_textview); 
    dateView.setText(Html.fromHtml("<b>" + "Release date: " + "</b> <br>" 
      + tvDetails.getShowReleaseDate())); 

    TextView voteView = (TextView) mActivity.findViewById(R.id.tv_details_vote_textview); 
    voteView.setText(Html.fromHtml("<b>" + "Vote average: " + "</b> <br>" 
      + Double.toString(tvDetails.getShowVoteAverage()) + "/10")); 

    TextView overviewView = (TextView) mActivity.findViewById(R.id.tv_details_overview_textview); 
    overviewView.setText(tvDetails.getShowOverview()); 

    // Make the cards visible after loading the content. 
    CardView posterCard = (CardView)mActivity.findViewById(R.id.tv_details_poster_card); 
    posterCard.setVisibility(View.VISIBLE); 

    CardView infoCard = (CardView)mActivity.findViewById(R.id.tv_details_info_card); 
    infoCard.setVisibility(View.VISIBLE); 

    CardView detailsCard = (CardView)mActivity.findViewById(R.id.tv_details_overview_card); 
    detailsCard.setVisibility(View.VISIBLE); 

    ArrayList<ShowThumbnail> seasonThumbnails = tvDetails.getSeasonsThumbnails(); 
    seasonsListAdapter = new SeasonsListAdapter(getActivity(), seasonThumbnails); 
    gridView.setAdapter(seasonsListAdapter); 

    // Dismiss the loading panel. 
    RelativeLayout loadingPanel = (RelativeLayout)mActivity.findViewById(R.id.tv_details_loading_panel); 
    loadingPanel.setVisibility(View.GONE); 

} 

fragment_tv_details.xml:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:card_view="http://schemas.android.com/apk/res-auto" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:layout_marginTop="?android:attr/actionBarSize"> 

<RelativeLayout 

    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:card_view="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/content_tv_details" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:adjustViewBounds="true" 
    android:padding="20dp" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:context="com.example.mordowiciel.filmapp.Activity.ShowDetailsActivity"> 

    <RelativeLayout 
     android:id="@+id/tv_details_loading_panel" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_centerHorizontal="true" 
     android:layout_centerVertical="true" 
     android:gravity="center"> 

     <ProgressBar 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:indeterminate="true" /> 
    </RelativeLayout> 

    <!-- Poster of a movie --> 

    <android.support.v7.widget.CardView 
     android:id="@+id/tv_details_poster_card" 
     android:layout_width="150dp" 
     android:layout_height="200dp" 
     android:visibility="invisible" 
     card_view:cardCornerRadius="4dp"> 

     <ImageView 
      android:id="@+id/tv_details_imageview" 
      android:layout_width="130dp" 
      android:layout_height="180dp" 
      android:layout_marginLeft="10dp" 
      android:layout_marginRight="10dp" 
      android:layout_marginTop="10dp" /> 

    </android.support.v7.widget.CardView> 

    <!-- Linear layout for info on the right. Root linear layout is crucial for 
     implementing MaxHeight attribute for CardView. (180dp.) 
     If content in CardView >180dp in height, then the view is starting to act 
     like scrollable.--> 

    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="180dp" 
     android:layout_alignParentRight="true" 
     android:layout_marginLeft="20dp" 
     android:layout_marginTop="20dp" 
     android:layout_toRightOf="@+id/tv_details_poster_card"> 

     <android.support.v7.widget.CardView 
      android:id="@+id/tv_details_info_card" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:visibility="invisible"> 

      <ScrollView 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:padding="5dp"> 

       <LinearLayout 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:orientation="vertical"> 

        <TextView 
         android:id="@+id/tv_details_title_textview" 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:padding="10dp" /> 

        <TextView 
         android:id="@+id/tv_details_vote_textview" 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:padding="10dp" /> 

        <TextView 
         android:id="@+id/tv_details_date_textview" 
         android:layout_width="match_parent" 
         android:layout_height="wrap_content" 
         android:padding="10dp" /> 

       </LinearLayout> 
      </ScrollView> 


     </android.support.v7.widget.CardView> 
    </LinearLayout> 

    <android.support.v7.widget.CardView 
     android:id="@+id/tv_details_overview_card" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/tv_details_poster_card" 
     android:layout_marginTop="20dp" 
     android:visibility="invisible"> 

     <TextView 
      android:id="@+id/tv_details_overview_textview" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:padding="10dp" /> 

    </android.support.v7.widget.CardView> 


    <android.support.v17.leanback.widget.HorizontalGridView 
     android:id="@+id/tv_details_seasons_gridview" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/tv_details_overview_card" 
     android:layout_marginTop="20dp" 
     android:gravity="center"> 
    </android.support.v17.leanback.widget.HorizontalGridView> 


</RelativeLayout> 

image_item.xml:

<android.support.v7.widget.CardView 
xmlns:card_view="http://schemas.android.com/apk/res-auto" 
xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_gravity="center" 
android:layout_width="150dp" 
android:layout_height="230dp" 
card_view:cardCornerRadius="4dp"> 

<RelativeLayout 

    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingTop="10dp" 
    android:paddingLeft="10dp" 
    android:paddingRight="10dp"> 

    <ImageView 
     android:id="@+id/image_item_imageview" 
     android:layout_width="130dp" 
     android:layout_height="180dp" 
     android:layout_centerHorizontal="true" 
     android:scaleType="centerCrop" /> 

    <TextView 
     android:id="@+id/image_item_textview" 
     android:layout_width="150dp" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/image_item_imageview" 
     android:layout_centerHorizontal="true" 
     android:ellipsize="end" 
     android:gravity="center" 
     android:maxLines="2" 
     android:text="Beniz" 
     android:layout_alignParentBottom="true" /> 

</RelativeLayout> 

和定製RecyclerView.Adapter:

public class SeasonsListAdapter extends RecyclerView.Adapter<SeasonsListAdapter.SeasonViewHolder> { 

private ArrayList<ShowThumbnail> showThumbnailsList; 
private Context ctx; 

class SeasonViewHolder extends RecyclerView.ViewHolder { 

    protected ImageView imageView; 
    protected TextView textView; 

    public SeasonViewHolder(View view) { 
     super(view); 
     this.imageView = (ImageView) view.findViewById(R.id.image_item_imageview); 
     this.textView = (TextView) view.findViewById(R.id.image_item_textview); 
    } 
} 

public SeasonsListAdapter(Context ctx, ArrayList<ShowThumbnail> showThumbnails) { 
    this.showThumbnailsList = showThumbnails; 
    this.ctx = ctx; 
} 

@Override 
public SeasonViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) { 

    View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.image_item, null); 
    SeasonViewHolder seasonViewHolder = new SeasonViewHolder(view); 
    return seasonViewHolder; 
} 

@Override 
public void onBindViewHolder (SeasonViewHolder seasonViewHolder, int i) { 

    ShowThumbnail showThumbnailItem = showThumbnailsList.get(i); 
    Picasso.with(ctx).load(showThumbnailItem.getShowPosterLink()) 
      .fit() 
      .into(seasonViewHolder.imageView); 
    seasonViewHolder.textView.setText(showThumbnailItem.getShowTitle()); 
} 

@Override 
public int getItemCount() { 
    return (null != showThumbnailsList ? showThumbnailsList.size() : 0); 
} 

回答

0

你的XML是錯誤的。
爲您的卡添加保證金。不是你的圖片。這將提供卡之間所需的間距!

<android.support.v7.widget.CardView 
    android:id="@+id/tv_details_poster_card" 
    android:layout_width="150dp" 
    android:layout_height="200dp" 
    android:visibility="invisible" 
    card_view:cardCornerRadius="4dp" 
    android:layout_marginLeft="10dp" 
    android:layout_marginRight="10dp" 
    android:layout_marginTop="10dp"> 

    <ImageView 
     android:id="@+id/tv_details_imageview" 
     android:layout_width="130dp" 
     android:layout_height="180dp" /> 

</android.support.v7.widget.CardView> 
+0

這不會是因爲tv_details_poster_card與Horizo​​ntalGridView無關。我編輯了我的問題,以便可以看到整個Fragment佈局的樣子。 – mordowiciel