it-swarm.com.ru

TabLayout обновить содержимое вкладки с настраиваемым представлением

Я использую TabLayout нового дизайна материала, и у меня проблема, я не могу обновить содержимое вкладки пользовательского представления после создания вкладки:

Я могу упростить мой метод внутри моего PagerAdapter с

public View setTabView(int position, boolean selected) {
    View v = LayoutInflater.from(context).inflate(R.layout.default_tab_view, null);
    tv = (TextView) v.findViewById(R.id.tabTextView);
    if(selected)
        tv.setText("SELECTED");
    else 
        tv.setText("UNSELECTED");       
    return v;
}

И в деятельности я могу упростить мой код с:

TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
ViewPager pager = (ViewPager) findViewById(R.id.viewpager);
PagerAdapter adapter = new PagerAdapter(getSupportFragmentManager());
pager.setAdapter(adapter);
tabLayout.setupWithViewPager(pager);
for (int i = 0; i < tabLayout.getTabCount(); i++) {
    boolean isFirstTab = i == 0;
    TabLayout.Tab tab = tabLayout.getTabAt(i);
    View v;
    v = adapter.setTabView(i, isFirstTab);
    v.setSelected(isFirstTab);
    tab.setCustomView(v);
}

tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
    @Override
    public void onTabSelected(TabLayout.Tab tab) {
        adapter.setTabView(tab.getPosition(), true);
    }

    @Override
    public void onTabUnselected(TabLayout.Tab tab) {
        adapter.setTabView(tab.getPosition(), false);
    }

    @Override
    public void onTabReselected(TabLayout.Tab tab) {

    }
});

Названия вкладок устанавливаются правильно при запуске приложения, но когда я меняю вкладку, содержимое остается прежним.

23
Giorgio Antonioli

Хорошо Я думаю, что это ошибка в библиотеке поддержки дизайна Android v22.

Потому что вы говорите об изменениях в содержании, но я не могу изменить цвет текста. После того, как вкладка создана, и если вы измените макет, она не будет отражаться.

И как я видел ваш код, вы даете пользовательский макет, используя setCustomView. и для изменения текста вы снова вызываете метод setTabView (). Вместо этого должен быть метод getCustomView (), чтобы вы могли изменить макет. В TabLayout.Tab.getCustomView есть метод, но у него нет идентификатора, и я доложил об этой ошибке.

https://code.google.com/p/Android/issues/detail?id=177492

[Обновление 08-07-2015]

Наконец, ошибка принята отслеживанием источника ошибок Android и помечена как Future Release. Таким образом, мы можем сказать, что ошибка больше не будет существовать в будущей библиотеке . И у нас может быть метод getCustomView(), чтобы мы могли легко получить наш пользовательский вид.

[Обновление 18-08-2015]

Наконец, ошибка устранена. Выпущено в библиотеку поддержки v23 libs . Просто обновите библиотеку поддержки с помощью менеджера SDK, и вы получите getCustomView () в качестве общедоступного.

просто измените эту строку в Gradle 

compile 'com.Android.support:design:23.0.0'

и убедитесь, что для compile и target sdk установлено значение 23.

пожалуйста, проверьте мой код работает нормально для меня

TabLayout.Tab tab=tabLayout.getTabAt(position);         
View view=tab.getCustomView();         
TextView txtCount= (TextView) 
view.findViewById(R.id.txtCount);         
txtCount.setText(count+"");
45
Moinkhan

Ну ладно, я мог бы найти очень хитрое решение только потому, что у меня не было времени ждать следующей версии библиотеки поддержки. Вот что я сделал:

  1. Установите для адаптера пейджера значение TabLayout tabLayout.setTabsFromPagerAdapter(pagerAdapter);
  2. Добавьте слушателя к вашему ViewPager 

        customViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }
    
        @Override
        public void onPageSelected(int position) {
            tabLayout.getTabAt(position).select();
        }
    
        @Override
        public void onPageScrollStateChanged(int state) {
        }
    });
    
  3. Добавить слушателя к вашему TabLayout 

    tabLayout.setOnTabSelectedListener(new
    TabLayout.OnTabSelectedListener() {
    
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            if (!isTabUpdating) {
                isTabUpdating = true;
                final int pos = tab.getPosition();
                customViewPager.setCurrentItem(pos);
    
                // Clears and populates all tabs
                tabLayout.setTabsFromPagerAdapter(pagerAdapter);
                invalidateTabs(pos);
            }
        }
    
        @Override
        public void onTabUnselected(TabLayout.Tab tab) {
        }
    
        @Override
        public void onTabReselected(TabLayout.Tab tab) {
            if (!isTabUpdating) {
                isTabUpdating = true;
                final int pos = tab.getPosition();
                customViewPager.setCurrentItem(pos);
    
                // Clears and populates all tabs
                tabLayout.setTabsFromPagerAdapter(pagerAdapter);
                invalidateTabs(pos);
            }
        }
    });
    
  4. Добавить метод для перерисовки всех вкладок 

    private void invalidateTabs(int selected) {
      for (int i = 0; i < tabLayout.getTabCount(); i++) {
          tabLayout.getTabAt(i).setCustomView(pagerAdapter.getTabView(i, i == selected));
      }
      isTabUpdating = false;
    }
    

Хорошо, позвольте мне объяснить немного. Прежде всего, вы можете спросить, почему я использовал setTabsFromPagerAdapter() вместо setupWithViewPager. Вначале я использовал setupWithViewPager, но почему-то он не работал с моим пейджером, и 1-й элемент не мог быть выбран. 

Второе, что вы можете признать - каждый раз, когда я выбираю вкладку, я удаляю их все. Что ж, это была довольно простая проблема, вы видите исходники Android, когда вызываете Tab.setCustomView(View), он проверяет родительский элемент представления, а если он не равен нулю - удаляет все дочерние представления. Однако, если вы передадите только что созданный элемент, вы добавите другое представление вместо замены старого: 

    View custom = tab.getCustomView();
        if(custom != null) {
            ViewParent icon = custom.getParent();
            if(icon != this) {
                if(icon != null) {
                    // You wont get here
                    ((ViewGroup)icon).removeView(custom);
                }

                this.addView(custom);
            }
     ...

Итак, я закончил с настройкой всех слушателей и заново создавал все вкладки каждый раз при изменении страницы/вкладки. Это НЕ хорошее решение, но поскольку Google не может дождаться обновления своей библиотеки - это, вероятно, единственное решение для достижения такого эффекта. (На тот случай, если вам интересно, почему это так сложно - мне нужно было иметь вкладки с пользовательскими видами (текст + изображение), которые могли бы изменять их свойства вида (цвет шрифта, изображение), когда они выбраны/не выбраны)

Кстати, вот метод getTabView(...) из 4-го шага:

public View getTabView(int pos, boolean isSeleted) {
    View tabview = ((LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout
                    .tab_sessioninfo,
            null, false);
    final ImageView ivTabIcon = (ImageView) tabview.findViewById(R.id.iv_tab_icon);
    final TextView tvTabTittle = (TextView) tabview.findViewById(R.id.tv_tab_title);

    if (isSeleted) {
        tvTabTittle.setTextColor(context.getResources().getColor(R.color.tab_indicator));
    }

    switch (pos) {
        case 0:
            tvTabTittle.setText("1st Tab");
            ivTabIcon.setImageResource(isSeleted ? R.drawable.ic_icon1_selected : R.drawable.ic_icon1);
            break;

        case 1:
            tvTabTittle.setText("2nd Tab");
            ivTabIcon.setImageResource(isSeleted ? R.drawable.ic_icon2_selected : R.drawable.ic_icon2);
            break;

        case 2:
            tvTabTittle.setText("3rd Tab");
            ivTabIcon.setImageResource(isSeleted ? R.drawable.ic_icon3_selected : R.drawable.ic_icon3);
            break;
    }

    return tabview;
}

Постскриптум Если вы знаете лучшее решение для всего этого, дайте мне знать!

ОБНОВЛЕНИЕ

Лучшее решение может быть достигнуто с помощью отражения:

  1. Простая настройка

    tabLayout.setupWithViewPager(customViewPager);
    customViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        }
    
        @Override
        public void onPageSelected(int position) {
            for (int i = 0; i <tabLayout.getTabCount(); i++){
                updateTab(tabLayout.getTabAt(i), position == i);
            }
        }
    
        @Override
        public void onPageScrollStateChanged(int state) {
        }
    });
    
  2. Обновление вкладку

    private void updateTab(TabLayout.Tab tab, boolean isSelected){
      Method method = null;
      try {
          method = TabLayout.Tab.class.getDeclaredMethod("getCustomView", null);
          method.setAccessible(true);
    
          View tabview = (View) method.invoke(tab, null);
    
          final ImageView ivTabIcon = (ImageView) tabview.findViewById(R.id.iv_tab_icon);
          final TextView tvTabTittle = (TextView) tabview.findViewById(R.id.tv_tab_title);
    
          if (isSeleted) {
              tvTabTittle.setTextColor(context.getResources().getColor(R.color.tab_indicator));
          }
    
          switch (pos) {
          case 0:
                tvTabTittle.setText("1st Tab");
                ivTabIcon.setImageResource(isSeleted ? R.drawable.ic_icon1_selected : R.drawable.ic_icon1);
                break;
    
          case 1:
                tvTabTittle.setText("2nd Tab");
                ivTabIcon.setImageResource(isSeleted ? R.drawable.ic_icon2_selected : R.drawable.ic_icon2);
                break;
    
          case 2:
                tvTabTittle.setText("3rd Tab");
                ivTabIcon.setImageResource(isSeleted ? R.drawable.ic_icon3_selected : R.drawable.ic_icon3);
                break;
          }
    
          tab.setCustomView(tabview);
      } catch (Exception e) {
          e.printStackTrace();
      }
    }
    

ОБНОВЛЕНИЕ

В новой библиотеке поддержки есть открытый метод для getCustomView(), поэтому вам больше не нужно размышлять!

7
Paul Freez

Посмотрите Ответ вам нужно установить макет, как вы ожидаете. Если вы хотите изменить содержимое вкладки, внесите изменения в Tab.setOnTabSelectedListener ()

tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
    @Override
    public void onTabSelected(TabLayout.Tab tab) {
        if(tab.getPosition()==1){
                tabLayout.setTabTextColors(ContextCompat.getColor(getActivity(), R.color.unselected_tab),ContextCompat.getColor(getActivity(), R.color.tab_selection));
            }else{
                tabLayout.setTabTextColors(ContextCompat.getColor(getActivity(), R.color.unselected_tab),ContextCompat.getColor(getActivity(), R.color.white));

            }

 // same thing goes with other tabs too
 // Just change your tab text on selected/deselected as above

    }

    @Override
    public void onTabUnselected(TabLayout.Tab tab) {
        tab.setCustomView(null);
    }

    @Override
    public void onTabReselected(TabLayout.Tab tab) {

    }
});
0
Tara

пожалуйста, проверьте мой код работает нормально для меня

TabLayout.Tab tab=tabLayout.getTabAt(position);         
View view=tab.getCustomView();         
TextView txtCount= (TextView) view.findViewById(R.id.txtCount);         
txtCount.setText(count+"");
0
Dalvendra Singh