我想创建步进器,如上图所示。以下是我尝试过的代码。圆圈下方的文字应位于圆圈的中心。在导航下一个活动时,应更改每一行的颜色。导航到下一个活动时,每个圆圈的颜色也应该改变。
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/padding_title"
android:layout_gravity="center"
android:gravity="center"
android:orientation="horizontal"
android:visibility="visible">
<View
android:id="@+id/circle_one"
android:layout_width="15dp"
android:layout_height="15dp"
android:background="@drawable/ic_gray_hollow_circle" />
<View
android:id="@+id/line_one"
android:layout_width="76dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/circle_one"
android:background="@drawable/ic_gray_line" />
<View
android:id="@+id/circle_two"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/line_one"
android:background="@drawable/ic_gray_hollow_circle" />
<View
android:id="@+id/line_two"
android:layout_width="76dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/circle_two"
android:background="@drawable/ic_gray_line" />
<View
android:id="@+id/circle_three"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/line_two"
android:background="@drawable/ic_gray_hollow_circle" />
<View
android:id="@+id/line_three"
android:layout_width="76dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/circle_three"
android:background="@drawable/ic_gray_line" />
<View
android:id="@+id/circle_four"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/line_three"
android:background="@drawable/ic_gray_hollow_circle" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/circle_one"
android:text="Pay"
android:textColor="#dbdbdb" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/circle_two"
android:layout_toEndOf="@id/line_one"
android:text="Amount"
android:textColor="#dbdbdb" />
</RelativeLayout>
任何帮助将不胜感激。
答案 0 :(得分:0)
您可以在每个活动的顶部添加此布局文件。然后在选择时更改颜色和文本。这是我刚才所说的一个例子。
首先制作一个布局文件。
<强> stepper_layout.xml 强>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/padding_title"
android:layout_gravity="center"
android:gravity="center"
android:orientation="horizontal"
android:visibility="visible">
<View
android:id="@+id/circle_one"
android:layout_width="15dp"
android:layout_height="15dp"
android:background="@drawable/ic_gray_hollow_circle" />
<View
android:id="@+id/line_one"
android:layout_width="76dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/circle_one"
android:background="@drawable/ic_gray_line" />
<View
android:id="@+id/circle_two"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/line_one"
android:background="@drawable/ic_gray_hollow_circle" />
<View
android:id="@+id/line_two"
android:layout_width="76dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/circle_two"
android:background="@drawable/ic_gray_line" />
<View
android:id="@+id/circle_three"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/line_two"
android:background="@drawable/ic_gray_hollow_circle" />
<View
android:id="@+id/line_three"
android:layout_width="76dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/circle_three"
android:background="@drawable/ic_gray_line" />
<View
android:id="@+id/circle_four"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_toEndOf="@+id/line_three"
android:background="@drawable/ic_gray_hollow_circle" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/circle_one"
android:text="Pay"
android:textColor="#dbdbdb" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/circle_two"
android:layout_toEndOf="@id/line_one"
android:text="Amount"
android:textColor="#dbdbdb" />
</RelativeLayout>
在FirstActivity布局中添加stepper_layout。
<强> FirstActivity.xml 强>
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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">
<include layout="@layout/stepper_layout" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="First!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
在SecondActivity布局中添加stepper_layout。
<强> SecondActivity.xml 强>
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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">
<include layout="@layout/stepper" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Second"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
根据需要更改stepper_layout视图。
<强> FirstActivity.java 强>
public class FirstActivity extends AppCompatActivity {
@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final View view = findViewById(R.id.circle_one);
view.setBackground(getResources().getDrawable(R.drawable.ic_green));
final View view2 = findViewById(R.id.circle_two);
view2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(FirstActivity.this, SecondActivity.class);
startActivity(intent);
finish();
}
});
}
}
根据需要更改stepper_layout视图。
<强> SecondActivity.java 强>
public class SecondActivity extends AppCompatActivity {
@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_second);
final View view2 = findViewById(R.id.circle_two);
view2.setBackground(getResources().getDrawable(R.drawable.ic_green));
final View view = findViewById(R.id.circle_one);
view.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(SecondActivity.this, FirstActivity.class);
startActivity(intent);
finish();
}
});
}
}
这里以两个活动为例。您需要添加更多。您可以在活动类中更改视图属性。希望这可以帮助。