同步工具欄高度與ViewPager

我有一個工具欄和ViewPager的活動，在ViewPager中有三個片段，每個片段應該設置不同高度的工具欄，這意味着當第一個片段是選定的片段工具欄的高度應該是x當第二片段被選中時，工具欄高度應該是y等等。同步工具欄高度與ViewPager

現在我想要更改工具欄高度與ViewPager滾動同步，任何建議要做到這一點？

來源

2016-01-27 MoHaKa

您可以爲每個片段使用工具欄，並從父片段中移除工具欄。 –

我想通過改變工具欄高度與ViewPager滾動同步來實現一絲美感，我的意思是我不想突然設置高度 – MoHaKa

如果您想平滑過渡，您可以隨時自定義viewpager –

這裏是輸出..

示例代碼https://github.com/msquare097/MFlex-toolbar，...

首先很好的問題和非常有趣的... 和實現它。
我已經使用viewpager滾動更改了工具欄的最小高度。

首先聲明所有Toolbar高度尊重您的活動中的片段，其中ViewPager已實施。

我直接把它作爲Integer。您可以將它從Dimension作爲DP加載並將其轉換爲PX。在我的ViewPager中，我已經拍攝了4個片段。所以聲明4工具欄的高度。

int heightForPage0 = 150; 
int heightForPage1 = 400; 
int heightForPage2 = 300; 
int heightForPage3 = 600;

設置電源後只需添加監聽

mViewPager.addOnPageChangeListener(this);

和覆蓋此三個方法，並寫如下的代碼..

@Override 
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 
     Log.d(TAG,positionOffset+""); 

     int currentHeight; 
     int nextHeight; 

     switch (position) { 
      case 0: 
       currentHeight = heightForPage0; 
       nextHeight = heightForPage1; 
       calculateHeightAndApply(currentHeight, nextHeight, positionOffset); 
       break; 
      case 1: 
       currentHeight = heightForPage1; 
       nextHeight = heightForPage2; 
       calculateHeightAndApply(currentHeight, nextHeight, positionOffset); 
       break; 
      case 2: 
       currentHeight = heightForPage2; 
       nextHeight = heightForPage3; 
       calculateHeightAndApply(currentHeight, nextHeight, positionOffset); 
       break; 
      case 3: 
       // for last page we don't have to worry about it. 
       // bcoz there is no next page available; 
       break; 
     } 
    } 

    @Override 
    public void onPageSelected(int position) {} 

    @Override 
    public void onPageScrollStateChanged(int state) {}

，這裏是那個神奇的方法，我在onPageScrolled ..

private void calculateHeightAndApply(int currentHeight, int nextHeight, float positionOffset) { 
    if (positionOffset==0) { 
     return; 
    } 
    int diff = nextHeight - currentHeight; 
     int newHeight = (int) ((positionOffset*diff)); 
     mToolbar.setMinimumHeight(currentHeight+newHeight); 
}

來源

2016-04-25 12:10:44 Moinkhan

如果要使用動畫，則可以使用PageTransformer。

ViewPager pager = (ViewPager) findViewById(R.id.viewpager); 

    pager.setPageTransformer(false, new ViewPager.PageTransformer() { 
     @Override 
     public void transformPage(View onepage, float position) { 
      //Position is the offset of onepage. 
      //If position == 0 , one page is center. 
      //If position == 1 , one page is on the right of center page. 
     } 
    });

來源

2016-01-27 14:30:54

謝謝回答，但是這段代碼會突然改變到工具欄高度，我希望工具欄高度可以在用戶在ViewPager – MoHaKa

@MoHaKa上分頁時更改，您可以使用PageTransformer。 –

謝謝，我會嘗試 – MoHaKa

試試這個：

int X = 30; 
int Y = 50; 
Toolbar toolbar = (Toolbar)findViewById(R.id.your_toolbar); 

yourViewPager.addOnPageChangeListener(pagerChangeListener()); 

public ViewPager.OnPageChangeListener pagerChangeListener() { 
    return new ViewPager.OnPageChangeListener() { 
     @Override 
     public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 
     } 
     @Override 
     public void onPageSelected(int position) { 
      if(position == 0){ 
       toolbar.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, X)); 
      }else{ 
       toolbar.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, Y)); 
      } 
     } 
     @Override 
     public void onPageScrollStateChanged(int state) { 
     } 
    };

來源

2016-04-25 08:45:20

你也可以在Interface的幫助下做到這一點。

接口：

public interface ChangeToolbarHeight { 
    void setToolbarHeight(int height); 
}

活動：

public class MainActivity extends AppCompatActivity implements ChangeToolbarHeight 
{ 
public void setToolbarHeight(int height) 
{ 
    RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) mToolbar.getLayoutParams(); 
layoutParams.height = height; 
toolbar.setLayoutParams(layoutParams); 
} 
}

您的片段裏面：

public class FragmentOne extends Fragment { 
    @Override 
     public void setUserVisibleHint(boolean isVisibleToUser) { 
      super.setUserVisibleHint(isVisibleToUser); 
      if (isVisibleToUser) 
      { 
      ChangeToolbarHeight changeHeightInterface = (ChangeToolbarHeight) getActivity(); 
      changeHeightInterface.setToolbarHeight(150); 
       Log.d("TAG","Current Fragment is visible"); 
      } 
     } 
    }

集迪菲爲每個片段租用高度。

SetUserVisbileHint是Fragment的默認方法。使用這個你可以找出哪個片段對用戶可見，並將可見的片段工具欄高度設置爲該活動。

這樣做的主要用途是，viewPager默認加載三個片段，前一個，當前選擇，然後下一個讓viewpager變成smoother.so，如果沒有選中SetUserVisibleHint。你的工具欄高度會變得混亂起來。當viewpager在後臺加載下一個。

你可能有片段1可見，但在工具欄的高度將被設置爲片段3或片段2.

來源

2016-04-26 09:39:13 HourGlass

你可以嘗試像下面的代碼：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:ads="http://schemas.android.com/apk/res-auto" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#fff" 
    android:orientation="vertical"> 


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

     <ImageView 
      android:id="@+id/bannar" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      android:src="@drawable/banner_1" /> 

     <com.astuetz.PagerSlidingTabStrip 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="48dip" 
      android:layout_below="@+id/bannar" 
      android:background="#fff" /> 

     <android.support.v4.view.ViewPager 
      android:id="@+id/pager" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_below="@+id/tabs" /> 
    </LinearLayout> 
</LinearLayout>

這對我的作品。我希望它也能爲你工作。謝謝

來源

2016-04-30 05:03:22

同步工具欄高度與ViewPager

回答

相關問題