关于进度条：在Android屏幕上显示加载覆盖

Display a loading overlay on Android screen

我希望在我的应用程序尝试登录服务器时，在屏幕上显示一个覆盖图，显示一个小的加载代码或甚至一些文本。我的登录屏幕都在垂直线性布局中。

我想要实现的效果是这样的：http：//docs.xamarin.com/recipes/ios/standard_controls/popovers/display_a_loading_message

也许为时已晚，但我想有人可能会发现它很有用。

活动：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69

public class MainActivity extends Activity implements View.OnClickListener {

String myLog ="myLog";

AlphaAnimation inAnimation;
AlphaAnimation outAnimation;

FrameLayout progressBarHolder;
Button button;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

button = (Button) findViewById(R.id.button);
progressBarHolder = (FrameLayout) findViewById(R.id.progressBarHolder);

button.setOnClickListener(this);

}

@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.button:
new MyTask().execute();
break;
}

}

private class MyTask extends AsyncTask <Void, Void, Void> {

@Override
protected void onPreExecute() {
super.onPreExecute();
button.setEnabled(false);
inAnimation = new AlphaAnimation(0f, 1f);
inAnimation.setDuration(200);
progressBarHolder.setAnimation(inAnimation);
progressBarHolder.setVisibility(View.VISIBLE);
}

@Override
protected void onPostExecute(Void aVoid) {
super.onPostExecute(aVoid);
outAnimation = new AlphaAnimation(1f, 0f);
outAnimation.setDuration(200);
progressBarHolder.setAnimation(outAnimation);
progressBarHolder.setVisibility(View.GONE);
button.setEnabled(true);
}

@Override
protected Void doInBackground(Void... params) {
try {
for (int i = 0; i < 5; i++) {
Log.d(myLog,"Emulating some task.. Step" + i);
TimeUnit.SECONDS.sleep(1);
}
} catch (InterruptedException e) {
e.printStackTrace();
}
return null;
}
}

}

布局xml：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

相关讨论

我喜欢克斯特亚的方法但是答案。

在此基础上，这里有一些想法可以在您的应用中轻松重复使用相同的叠加层：

考虑将叠加层FrameLayout放在单独的布局文件中，例如res/layout/include_progress_overlay：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

(我在叠加层FrameLayout中添加的一件事是android:clickable="true"。因此，当显示叠加层时，它会阻止点击进入其下方的UI元素。至少在我的典型用例中，这就是我想要的。)

然后在需要的地方加入：

1 2	<!-- Progress bar overlay; shown while login is in progress --> <include layout="@layout/include_progress_overlay"/>

在代码中：

1
2
3
4
5
6
7
8
9
10
11
12

View progressOverlay;
[...]

progressOverlay = findViewById(R.id.progress_overlay);
[...]

// Show progress overlay (with animation):
AndroidUtils.animateView(progressOverlay, View.VISIBLE, 0.4f, 200);
[...]

// Hide it (with animation):
AndroidUtils.animateView(progressOverlay, View.GONE, 0, 200);

将动画代码提取到util方法中：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

/**
* @param view View to animate
* @param toVisibility Visibility at the end of animation
* @param toAlpha Alpha at the end of animation
* @param duration Animation duration in ms
*/
public static void animateView(final View view, final int toVisibility, float toAlpha, int duration) {
boolean show = toVisibility == View.VISIBLE;
if (show) {
view.setAlpha(0);
}
view.setVisibility(View.VISIBLE);
view.animate()
.setDuration(duration)
.alpha(show ? toAlpha : 0)
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
view.setVisibility(toVisibility);
}
});
}

(这里使用view.animate()，在API 12中添加，而不是AlphaAnimation。)

相关讨论

我在相对布局中有ProgressBar，我分别隐藏或显示它。是的活动可以是透明的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
android:id="@+id/hsvBackgroundContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
</LinearLayout>

<ProgressBar
android:id="@+id/pbProgess"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />

</RelativeLayout>

相关讨论

可以使用ProgressDialog创建在应用程序上显示消息的微调器。虽然它没有达到图片中的确切效果，但它是展示应用程序正常工作的好方法。

我有同样的问题，我尝试了解决方案，但不是最好的用户界面，所以，我做了以下步骤。

将屏幕划分为2个视图：Content和ProgressBar。

如果要调用ProgressBar，可以将可见性更改为VISIBLE，并将以下属性添加到content id = content而不是progressBar容器。

content.background ="＃000000"
content.alpha ="0.4"

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

您必须使用AsyncTask等线程概念进行后台操作。使用此功能，您可以隐藏UI部分中的实际工作。操作完成后，AsyncTask将被取消分配。

创建AsyncTask的子类
使用AsyncTask进行后台工作
调用onPreExecute()来初始化任务
使用带有setIndeterminate(true)的进度条启用
不确定的模式
调用onProgressUpdate()来设置进度条的动画以让用户
知道正在做一些工作
使用incrementProgressBy()通过a增加进度条内容
具体价值
调用doInBackground()并在此处完成后台工作
捕获InterruptedException对象以查找背景结束
手术
调用onPostExecute()表示操作结束并显示
结果

Android的不确定ProgressDialog教程

在Android应用程序中加载资源时启动屏幕