Utilice HomeTabModeHelper para crear rápidamente un marco de página de inicio Tab + Fragmento en 2 minutos

Prefacio

En el entorno actual, donde varios modelos de aplicaciones son exactamente iguales y los programadores tienen varios efectos sofisticados, cada vez que se hace cargo de un proyecto, puede ver que el código del proyecto es diferente y desea unificarlo cada minuto. Al mismo tiempo, con el fin de acelerar el desarrollo de nuevas aplicaciones posteriores, el paquete construyó un marco simple preliminar para realizar la construcción rápida y sin cerebro de la página de inicio en dos minutos.

No hay mucho que decir, veamos primero el efecto logrado:
5h78t-j9qb8.gif

Introducción

Darse cuenta de la función:

  • Construcción de página de inicio en modo tabulador + fragmento
  • Soporte ViewPager
  • Admite pantalla de punto rojo pequeño (cantidad de pantalla opcional)
  • Soporte resaltando una pestaña determinada
  • Ocultar pestaña dinámicamente

utilizar

Importar biblioteca

implementation 'com.moore.lib:homeTabModeHelper:1.0.0'

Si no ha agregado la dirección del almacén jcenter (), recuerde agregarla ~

Pestaña Configurar

Usamos el archivo .json para la configuración y luego el archivo se almacena en assets. La referencia de configuración es la siguiente:

{
  "textColorNormal": "#A4A3A3",
  "textColorSelected": "#C02221",
  "textSizeNormal": 14,
  "textSizeSelected": 14,
  "backgroundColor": "#e9e9e9",
  "isNameResId": false,
  "isTitleVisible": true,
  "tabs": [
    {
      "tabName": "首页",
      "tabTag": "key_index_fragment",
      "iconNormal": "main_home_tab_index_normal",
      "iconSelected": "main_home_tab_index_selected"
    },
    {
      "tabName": "发现",
      "tabTag": "key_discover_fragment",
      "iconNormal": "main_home_tab_discovery_normal",
      "iconSelected": "main_home_tab_discovery_selected",
      "isOverSide": true,
      "itemBg": "home_tab_center_bg"
    },
    {
      "tabName": "我的",
      "tabTag": "key_user_fragment",
      "iconNormal": "main_home_tab_mine_normal",
      "iconSelected": "main_home_tab_mine_selected"
    }
  ]
}

Aquí hay una explicación del rol de cada configuración:

En primer lugar, dos propiedades descritas caracteres de tabulación, dos estados textColorNormal,, textColorSelected, textSizeNormal, textSizeSelectedel papel de estos atributos en el color de texto de pestaña y el tamaño de la cabecera.
isNameResId: Indica si el título es el id del recurso en la cadena, si es falso, tomar directamente el tabName configurado, en caso contrario, obtener el archivo de recursos correspondiente al id. El valor predeterminado es verdadero
isTitleVisible: si el título es visible. El valor predeterminado es verdadero
tabs: lista de pestañas

La configuración de cada pestaña:
tabName: ficha Título, si la configuración string.xml usado, en comparación con el correspondiente ID de cadena
tabTag: importante para distinguir cada etiqueta correspondiente a la pestaña Fragmento no se puede repetir
iconNormal,: iconSelectedun icono correspondiente a los dos estados, Póngalo en dibujable en lugar de mipmap.
Opciones:
isOverSidetipo booleano, si necesita mostrar sobresaliente, puede establecer esta propiedad. Consulte la representación anterior para el estilo
itemBg: después de configurar la pantalla elevada, puede establecer el fondo, generalmente un semicírculo, fondo de prototipo, etc. de

Uso doméstico

En el archivo xml correspondiente a la página de inicio, simplemente use lo siguiente:
Configuración de parámetros clave:
container_idEspecifique el ID de diseño de la pantalla Fragmento
config_file_name: El nombre del archivo de configuración en los activos, el nombre completo
viewPager_id: Elija uno de container_id, si está configurado, es ViewPager puede deslizar el modo, la identificación correspondiente está asociada con el diseño de ViewPager

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    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="#999999">

    <FrameLayout
        android:id="@+id/main_content_layout"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@id/main_tab_layout"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_weight="1" />

    <com.moore.bottomtab.HomeBottomTabLayout
        android:id="@+id/main_tab_layout"
        android:layout_width="match_parent"
        android:layout_height="58dp"
        android:background="#ffffff"
        app:config_file_name="tab.json"
        app:container_id="@id/main_content_layout"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toBottomOf="@id/main_content_layout" />

</androidx.constraintlayout.widget.ConstraintLayout>

Código de la página de inicio

class MainActivity : AppCompatActivity(), HomeBottomTabLayout.HomeBottomTabLayoutCallback {

    //每个tab对应的tag,和json配置文件中保持一致
    val TAG_INDEX = "key_index_fragment"
    val TAG_NAME = "key_name_fragment"
    val TAG_DISCOVERY = "key_discover_fragment"
    val TAG_COLLECT = "key_collect_fragment"
    val TAG_USER = "key_user_fragment"

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        //设置回调
        main_tab_layout.setHomeBottomTabLayoutCallback(this)
        //初始化,参数为默认展示第几个tab
        main_tab_layout.initFirstTab(2)
        //如果需要展示未读消息,通过该方法展示
        main_tab_layout.setUnreadTip(TAG_USER, "12")
        main_tab_layout.setUnreadTip(TAG_INDEX, "99+")
        main_tab_layout.setUnreadTip(TAG_COLLECT, null, false)
    }

    override fun getFragmentByTag(tabTag: String): Fragment? {
        //根据对应Tag名称,返回具体的Fragment对象
        when (tabTag) {
            TAG_INDEX -> return Fragment1()
            TAG_NAME -> return Fragment2()
            TAG_DISCOVERY -> return Fragment3()
            TAG_COLLECT -> return Fragment4()
            TAG_USER -> return Fragment5()
        }
        return null
    }

    override fun onClickChangeTab(selectedIndex: Int, selectedTag: String?) {
        //点击tab回调,可在此进行统计事件、隐藏消息提示等操作
    }
}

En este punto, puede ejecutar su aplicación para probar, y puede ver que ha aparecido una estructura Tab + Fragmento. Es muy simple y conveniente. No hay necesidad de operaciones complejas como composición tipográfica xml, devoluciones de llamada de clic en el código, cambio de fragmento, etc., código También es muy claro.

Más formas

setUnreadTip("tagName","unReadCount",isShowCount): Configure la solicitud de mensaje no leído, configure la pestaña correspondiente de acuerdo con la etiqueta, el segundo parámetro es el valor de la solicitud y el tercero es si mostrar el número específico o solo el pequeño punto rojo.
hideUnReadTip(tag: String): Ocultar mensajes no leídos. Sugerencia
getFragmentList(): List<Fragment?>?: Obtener la lista de Fragmentos agregados
getFragmentByTag(tabTag: String): Fragment?: Obtener el Fragmento según la Etiqueta
getCurrentSelectedFragment(): Fragment?: Obtener el Fragmento seleccionado actualmente
getCurrentSelectedIndex(): Int: Obtener el subíndice del
getCurrentSelectedTag(): StringFragmento seleccionado actualmente: Obtener la Etiqueta del Fragmento seleccionado actualmente
selectByTag(tabTag: String): Seleccionar la pestaña de acuerdo con la etiqueta
hideTab(index: Int): Ocultar una pestaña

Conclusión

El marco está dirigido principalmente a la encapsulación de algunas funciones que se encuentran a menudo en el desarrollo diario. No implica demasiada lógica y procesamiento complicados. Está diseñado para ayudar a mejorar nuestra eficiencia de desarrollo. Si es útil para aquellos que se sienten bien, también haga clic en Genial ~

Entrega de Github: https://github.com/lizebinbin/HomeTabModeHelper

Supongo que te gusta

Origin blog.csdn.net/lizebin_bin/article/details/108781262
Recomendado
Clasificación