2015-12-12 14 views

Odpowiedz

17

Jedynym rozwiązaniem, jakie mogę znaleźć, to pobranie kodu źródłowego oryginału TabLayout i dostosowanie go do własnych potrzeb.

W rzeczywistości, wszystko, co musisz zrobić, aby uzyskać tę niestandardową strzałkę wskazującą, to przesłonić metodę SlidingTabStrip za pomocą metody void draw(Canvas canvas). Niestety, SlidingTabStrip jest private wewnętrzna klasa wewnątrz TabLayout.

enter image description here

szczęście cały kod biblioteki wsparcie jest otwarta, więc możemy stworzyć nasz własny TabLayoutWithArrow klasę. Wymieniłem standardowe void draw(Canvas canvas) przez ten jeden rysować strzałki:

 @Override 
     public void draw(Canvas canvas) { 
      super.draw(canvas); 
      // i used <dimen name="pointing_arrow_size">3dp</dimen> 
      int arrowSize = getResources().getDimensionPixelSize(R.dimen.pointing_arrow_size); 

      if (mIndicatorLeft >= 0 && mIndicatorRight > mIndicatorLeft) { 
       canvas.drawRect(mIndicatorLeft, getHeight() - mSelectedIndicatorHeight - arrowSize, 
         mIndicatorRight, getHeight() - arrowSize, mSelectedIndicatorPaint); 
       canvas.drawPath(getTrianglePath(arrowSize), mSelectedIndicatorPaint); 
      } 
     } 

     private Path getTrianglePath(int arrowSize) { 
      mSelectedIndicatorPaint.setStyle(Paint.Style.FILL_AND_STROKE); 
      mSelectedIndicatorPaint.setAntiAlias(true); 

      int leftPointX = mIndicatorLeft + (mIndicatorRight - mIndicatorLeft)/2 - arrowSize*2; 
      int rightPointX = leftPointX + arrowSize*2; 
      int bottomPointX = leftPointX + arrowSize; 
      int leftPointY = getHeight() - arrowSize; 
      int bottomPointY = getHeight(); 

      Point left = new Point(leftPointX, leftPointY); 
      Point right = new Point(rightPointX, leftPointY); 
      Point bottom = new Point(bottomPointX, bottomPointY); 

      Path path = new Path(); 
      path.setFillType(Path.FillType.EVEN_ODD); 
      path.setLastPoint(left.x, left.y); 
      path.lineTo(right.x, right.y); 
      path.lineTo(bottom.x, bottom.y); 
      path.lineTo(left.x, left.y); 
      path.close(); 

      return path; 
     } 

oczywiście, tło, konkretny projekt wskaźnika można poprawić/wyregulować według własnych potrzeb.

aby mój zwyczaj TabLayoutWithArrow, musiałem skopiować te pliki w moim projekcie:

  • AnimationUtils
  • TabLayout
  • ThemeUtils
  • ValueAnimatorCompat
  • ValueAnimatorCompatImplEclairMr1
  • ValueAnimatorCompatImplHoneycombMr1
  • ViewUtils
  • ViewUtilsLollipop

Aby mieć przejrzystość tyłu strzałkę, wystarczy ustawić ten Shape - drawable jako background dla TabLayoutWithArrow:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 

    <item android:bottom="@dimen/pointing_arrow_size"> 
     <shape android:shape="rectangle" > 
      <solid android:color="#FFFF00" /> 
     </shape> 
    </item> 
    <item android:height="@dimen/pointing_arrow_size" 
     android:gravity="bottom"> 
     <shape android:shape="rectangle" > 
      <solid android:color="#00000000" /> 
     </shape> 
    </item> 
</layer-list> 

a rzeczywiste użycie jest:

<klogi.com.viewpagerwithdifferentmenu.CustomTabLayout.TabLayoutWithArrow 
    android:id="@+id/tabLayout" 
    android:background="@drawable/tab_layout_background" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"/> 

Przesłałem całą p roject (TabLayoutWithArrow + aplikacja obsługująca jedną stronę, która go używa) do mojego dropboxa - feel free to check it out.

Mam nadzieję, że pomaga

+0

Działa dobrze, jak możemy zwiększyć wysokość wskaźnika? – Jaydeep

+0

Doskonała odpowiedź !!! Jak mogę odwrócić trójkąt? –

1

teraz to nie działa, klasa tintmanager zostanie usunięty z biblioteki wsparcia 23.2.0, udało mi samą funkcjonalność poprzez zmianę tła rozciągliwej w czasie wykonywania wewnątrz pętli for wykrywanie położenia, PS kliknięciu: sprawdź to pytanie i odpowiedź Używam tej samej biblioteki: https://github.com/astuetz/PagerSlidingTabStrip/issues/141

Powiązane problemy