Title bar frame
- Project address: Github
- Blog address: Android title bar (TitleBar) excellent solution
- If you want to understand the implementation principle, you can refer to the article: Create a universal title bar TitleBar purely by hand
Integration steps
- If your project Gradle configuration is below
7.0, you need to add it to the build.gradle file
allprojects {
repositories {
// JitPack remote warehouse: https://jitpack.io
maven { url 'https://jitpack.io' }
}
}
- If your Gradle configuration is
7.0 and above, you need to add it to the settings.gradle file
dependencyResolutionManagement {
repositories {
// JitPack remote warehouse: https://jitpack.io
maven { url 'https://jitpack.io' }
}
}
- After configuring the remote warehouse, add remote dependencies to the
build.gradle file under the project app module
android {
//Support JDK 1.8
compileOptions {
targetCompatibility JavaVersion.VERSION_1_8
sourceCompatibility JavaVersion.VERSION_1_8
}
}
dependencies {
// Title bar framework: https://github.com/getActivity/TitleBar
implementation 'com.github.getActivity:TitleBar:10.5'
}
Layout attributes
- For different versions of xml attribute adaptation, please click here to view
<declare-styleable name="TitleBar">
<!-- Title bar background -->
<attr name="android:background" />
<!-- Title bar style -->
<attr name="barStyle">
<enum name="light" value="0x10" />
<enum name="night" value="0x20" />
<enum name="transparent" value="0x30" />
<enum name="ripple" value="0x40" />
</attr>
<!-- Vertical inner spacing of sub-controls (can be used to adjust the adaptive height of the title bar) -->
<attr name="childVerticalPadding" format="dimension" />
<!-- middle title -->
<attr name="title" format="string" />
<attr name="titleColor" format="reference|color" />
<attr name="titleSize" format="dimension" />
<attr name="titleGravity">
<flag name="left" value="0x03" />
<flag name="right" value="0x05" />
<flag name="center" value="0x11" />
<flag name="start" value="0x00800003" />
<flag name="end" value="0x00800005" />
</attr>
<attr name="titleStyle">
<flag name="normal" value="0" />
<flag name="bold" value="1" />
<flag name="italic" value="2" />
</attr>
<attr name="titleIcon" format="reference" />
<attr name="titleIconWidth" format="dimension" />
<attr name="titleIconHeight" format="dimension" />
<attr name="titleIconPadding" format="dimension" />
<attr name="titleIconTint" format="color" />
<attr name="titleIconGravity">
<flag name="top" value="0x30" />
<flag name="bottom" value="0x50" />
<flag name="left" value="0x03" />
<flag name="right" value="0x05" />
<flag name="start" value="0x00800003" />
<flag name="end" value="0x00800005" />
</attr>
<attr name="titleHorizontalPadding" format="dimension" />
<!-- Middle title text overflow processing mode (marquee is enabled by default) -->
<attr name="titleOverflowMode">
<enum name="none" value="0" />
<enum name="start" value="1" />
<enum name="middle" value="2" />
<enum name="end" value="3" />
<enum name="marquee" value="4" />
</attr>
<!-- Left title -->
<attr name="leftTitle" format="string"/>
<attr name="leftTitleColor" format="reference|color" />
<attr name="leftTitleSize" format="dimension" />
<attr name="leftTitleStyle">
<flag name="normal" value="0" />
<flag name="bold" value="1" />
<flag name="italic" value="2" />
</attr>
<attr name="leftIcon" format="reference" />
<attr name="leftIconWidth" format="dimension" />
<attr name="leftIconHeight" format="dimension" />
<attr name="leftIconPadding" format="dimension" />
<attr name="leftIconTint" format="color" />
<attr name="leftIconGravity">
<flag name="top" value="0x30" />
<flag name="bottom" value="0x50" />
<flag name="left" value="0x03" />
<flag name="right" value="0x05" />
<flag name="start" value="0x00800003" />
<flag name="end" value="0x00800005" />
</attr>
<attr name="leftBackground" format="reference|color" />
<attr name="leftForeground" format="reference|color" />
<attr name="leftHorizontalPadding" format="dimension" />
<!-- Left title text overflow processing mode -->
<attr name="leftTitleOverflowMode">
<enum name="none" value="0" />
<enum name="start" value="1" />
<enum name="middle" value="2" />
<enum name="end" value="3" />
<enum name="marquee" value="4" />
</attr>
<!-- Right title -->
<attr name="rightTitle" format="string" />
<attr name="rightTitleColor" format="reference|color" />
<attr name="rightTitleSize" format="dimension" />
<attr name="rightTitleStyle">
<flag name="normal" value="0" />
<flag name="bold" value="1" />
<flag name="italic" value="2" />
</attr>
<attr name="rightIcon" format="reference" />
<attr name="rightIconWidth" format="dimension" />
<attr name="rightIconHeight" format="dimension" />
<attr name="rightIconPadding" format="dimension" />
<attr name="rightIconTint" format="color" />
<attr name="rightIconGravity">
<flag name="top" value="0x30" />
<flag name="bottom" value="0x50" />
<flag name="left" value="0x03" />
<flag name="right" value="0x05" />
<flag name="start" value="0x00800003" />
<flag name="end" value="0x00800005" />
</attr>
<attr name="rightBackground" format="reference|color" />
<attr name="rightForeground" format="reference|color" />
<attr name="rightHorizontalPadding" format="dimension" />
<!-- Right title text overflow processing mode -->
<attr name="rightTitleOverflowMode">
<enum name="none" value="0" />
<enum name="start" value="1" />
<enum name="middle" value="2" />
<enum name="end" value="3" />
<enum name="marquee" value="4" />
</attr>
<!-- dividing line -->
<attr name="lineVisible" format="boolean" />
<attr name="lineDrawable" format="reference|color" />
<attr name="lineSize" format="dimension" />
</declare-styleable>
XML example
- Click here to view the complete Demo example
Set listening events
titleBar.setOnTitleBarListener(new OnTitleBarListener() {
@Override
public void onLeftClick(TitleBar titleBar) {
toast("The left item View was clicked");
}
@Override
public void onTitleClick(TitleBar titleBar) {
toast("The middle View was clicked");
}
@Override
public void onRightClick(TitleBar titleBar) {
toast("The right View was clicked");
}
});
Unify TitleBar style
- If you are not satisfied with the default style or properties of TitleBar, you can intercept and modify it where the Application is initialized.
public class XxxApplication extends Application {
@Override
public void onCreate() {
super.onCreate();
//Initialize TitleBar default style
TitleBar.setDefaultStyle(new ITitleBarStyle());
}
}
Framework obfuscation rules
- Add in the obfuscation rule file
proguard-rules.pro
-keep class com.hjq.bar.** {*;}
Frame highlights
- Best performance: do not use LayoutInflater, but use code to create the form of View
- Best experience: The default style of TitleBar is already very good, you can download the Demo for testing
- Supports manipulation of sub-controls: you can get the sub-controls of TitleBar in the code to call the relevant API
- Compatible with immersive status bar: Compatible with Github’s immersive status bar framework to achieve a fully immersive effect
- Good framework compatibility: This framework does not rely on any third-party libraries and is compatible with all Android versions.
- Supports global configuration style: TitleBar style can be initialized in Application to achieve a once and for all effect.