气球库是另一个流行的功能,通常在大多数Android应用中使用。您可以在大多数购物和消息传递应用程序中看到此功能。借助此功能,您可以获取有关在任何应用程序中下一步要做什么的提示。在本文中,我们将了解如何在Android App中实现气球视图。下面给出了一个示例GIF,以了解我们将在本文中做些什么。注意,我们将使用Java语言实现该项目。
气球库的应用
- 气球库可用于以有吸引力的方式显示用于消息传递应用程序的EditText提示。
- 它可用于在Android应用程序中显示吐司消息。
- 帮助用户了解在其中显示提示文本的Android应用中的下一步操作。
气球库的属性
Attributes |
Description |
---|---|
.setWidthRatio() | Use to display the width of pop up according to ratio of horizontal screen size. |
.showAlignBottom() | Use to display pop up at bottom. |
.dismiss() | Use to dismiss pop up after it has been shown. |
.setMargin() | Use to give margin from all sides. |
.setIsVisibleArrow() | Use to show Arrow. |
.setArrowPosition() | Use to set the position of arrow to the pop up. |
.setArrowOrientation() | Use to set the orientation of the pop up. |
.setText() | Use to display Text. |
.setTextColor() | Use to display Text Color. |
.setHeight() | Use to give height to pop up. |
.setCornerRadius() | Use to make pop up rounded from all sides. |
.setBalloonAnimation() | Use to give Animation to pop up. |
分步实施
步骤1:创建一个新项目
要在Android Studio中创建新项目,请参阅如何在Android Studio中创建/启动新项目。请注意,选择Java作为编程语言。
步骤2:在build.gradle文件中添加Balloon库的依赖项
然后导航到gradle脚本,然后到build.gradle(Module)级别。在依赖性部分的build.gradle文件中添加以下行。
implementation “com.github.skydoves:balloon:1.2.9”
现在单击立即同步,它将同步build.gradle()中的所有文件。
第3步:在activity_main.xml中创建一个新的Balloon视图
转到activity_main.xml文件,并参考以下代码。以下是activity_main.xml文件的代码。
XML
Java
import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.widget.Button;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.content.ContextCompat;
import com.skydoves.balloon.ArrowOrientation;
import com.skydoves.balloon.Balloon;
import com.skydoves.balloon.BalloonAnimation;
public class MainActivity extends AppCompatActivity {
Button button;
Balloon balloon;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Id for the button
button = findViewById(R.id.button);
// Balloon view created here
balloon = new Balloon.Builder(getApplicationContext())
.setArrowSize(10)
.setArrowOrientation(ArrowOrientation.TOP)
.setIsVisibleArrow(true)
.setArrowPosition(0.3f)
.setWidthRatio(0.6f)
.setHeight(65)
.setTextSize(15f)
.setCornerRadius(4f)
.setAlpha(0.9f)
.setText("Hi! Geeks for Geeks.")
.setTextColor(ContextCompat.getColor(getApplicationContext(), R.color.design_default_color_secondary))
.setBackgroundColor(ContextCompat.getColor(getApplicationContext(), R.color.design_default_color_secondary_variant))
.setBalloonAnimation(BalloonAnimation.FADE)
.build();
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
balloon.showAlignBottom(button);
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
balloon.dismiss();
}
}, 2000);
}
});
}
}
步骤4:使用MainActivity。 Java文件
转到MainActivity。 Java文件并参考以下代码。下面是MainActivity的代码。 Java文件。在代码内部添加了注释,以更详细地了解代码。
Java
import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.widget.Button;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.content.ContextCompat;
import com.skydoves.balloon.ArrowOrientation;
import com.skydoves.balloon.Balloon;
import com.skydoves.balloon.BalloonAnimation;
public class MainActivity extends AppCompatActivity {
Button button;
Balloon balloon;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Id for the button
button = findViewById(R.id.button);
// Balloon view created here
balloon = new Balloon.Builder(getApplicationContext())
.setArrowSize(10)
.setArrowOrientation(ArrowOrientation.TOP)
.setIsVisibleArrow(true)
.setArrowPosition(0.3f)
.setWidthRatio(0.6f)
.setHeight(65)
.setTextSize(15f)
.setCornerRadius(4f)
.setAlpha(0.9f)
.setText("Hi! Geeks for Geeks.")
.setTextColor(ContextCompat.getColor(getApplicationContext(), R.color.design_default_color_secondary))
.setBackgroundColor(ContextCompat.getColor(getApplicationContext(), R.color.design_default_color_secondary_variant))
.setBalloonAnimation(BalloonAnimation.FADE)
.build();
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
balloon.showAlignBottom(button);
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
balloon.dismiss();
}
}, 2000);
}
});
}
}