我试图创建一个系统的布局图,它非常类似于一个表,因此,我试图创建一个具有行和列的约束布局(我可能需要用线连接,因此,垂直/水平布局不是最适合它)。
此外,由于系统的大小不同,只有在运行时才知道,所以我必须以编程方式绘制布局。
我在构造这样一个ConstraintLayout时遇到了一个问题--即使我已经将所有元素添加到布局中,它也不会在屏幕上呈现它们。
我正在使用Android Pie(API级别28,为使用它的特定设备创建)和Java 8。
我已经遵循了以下文章中给出的说明:
- https://spin.atomicobject.com/2019/04/08/constraintlayout-chaining-views-programmatically/
- https://www.zoftino.com/adding-views-&-constraints-to-android-constraint-layout-programmatically
附加我的代码的简化版本(仍然不起作用)。
代码执行以下操作:
1.创建一些模型数据
1.对于每行:
2.1.根据行中的数字创建按钮并将其添加到常规布局中
2.2.使用常规ConstrainSet 连接按钮
2.3.创建一个链出的按钮在当前行(因为我希望这些是在同一海拔)
2.4.将数字0的底部连接到前一行(或连接到屏幕的顶部,这些是每行的“中心”)
代码是:
public class MainActivity extends AppCompatActivity {
private final static String logTag = "Main Test";
private final static int NUM_OF_ROWS = 5;
private List<List<Integer>> mLayoutNums;
private ConstraintLayout mScreenLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mScreenLayout = findViewById(R.id.main_layout);
createMockupData();
drawBuildingLayout();
}
private void createMockupData() {
mLayoutNums = new ArrayList<>(NUM_OF_ROWS);
/*
The output should be as follows:
[2, 0, 1, 3]
[0]
[0, 1]
[1, 0, 2, 3, 4]
[0, 1, 2]
*/
mLayoutNums.add(Arrays.asList(0, 1, 2));
mLayoutNums.add(Arrays.asList(1, 0, 2, 3, 4));
mLayoutNums.add(Arrays.asList(0, 1));
mLayoutNums.add(Arrays.asList(0));
mLayoutNums.add(Arrays.asList(2, 0, 1, 3));
}
private void drawBuildingLayout() {
ConstraintSet conSet = new ConstraintSet();
conSet.clone(mScreenLayout);
int[] centerIds = new int[NUM_OF_ROWS];
for (int row = NUM_OF_ROWS - 1; row >= 0; --row) {
List<Integer> numsInRow = mLayoutNums.get(row);
addSingleRow(row, numsInRow, conSet, centerIds);
}
// connect last row to the bottom
conSet.connect(ConstraintSet.PARENT_ID,
ConstraintSet.BOTTOM,
centerIds[0],
ConstraintSet.BOTTOM);
conSet.createVerticalChain(ConstraintSet.PARENT_ID,
ConstraintSet.TOP,
ConstraintSet.PARENT_ID,
ConstraintSet.BOTTOM,
centerIds,
null,
ConstraintSet.CHAIN_SPREAD);
conSet.applyTo(mScreenLayout);
Log.i(logTag, "the screen should be shown now: " + mScreenLayout.isShown());
}
private void addSingleRow(int row,
List<Integer> numsInRow,
ConstraintSet conSet,
int[] centerIds) {
if (numsInRow.size() > 1) {
addMultipleNumsRow(row, numsInRow, conSet, centerIds);
}
else if (numsInRow.size() == 1){
addSingleNumRow(row, numsInRow.get(0), conSet, centerIds);
}
}
private void connectToPrevRow(int row, ConstraintSet conSet, int[] centerIds) {
if (row < NUM_OF_ROWS - 1) {
conSet.connect(centerIds[row + 1],
ConstraintSet.BOTTOM,
centerIds[row],
ConstraintSet.TOP);
} else if (row == NUM_OF_ROWS - 1) {
conSet.connect(ConstraintSet.PARENT_ID,
ConstraintSet.TOP,
centerIds[row],
ConstraintSet.TOP);
}
}
private void connectAndChainRow(int[] rowButtonIds,
ConstraintSet conSet) {
// First button will be attached to the left side of the parent
int leftNeighborId = ConstraintSet.PARENT_ID;
int leftNeighborSide = ConstraintSet.LEFT;
for (int col = 0; col < rowButtonIds.length; ++col) {
conSet.connect(leftNeighborId,
leftNeighborSide,
rowButtonIds[col],
ConstraintSet.LEFT);
leftNeighborId = rowButtonIds[col];
leftNeighborSide = ConstraintSet.RIGHT;
}
// Connecting to the right side of the parent
conSet.connect(leftNeighborId,
leftNeighborSide,
ConstraintSet.PARENT_ID,
ConstraintSet.RIGHT);
conSet.createHorizontalChain(ConstraintSet.PARENT_ID,
ConstraintSet.LEFT,
ConstraintSet.PARENT_ID,
ConstraintSet.RIGHT,
rowButtonIds,
null,
ConstraintSet.CHAIN_SPREAD);
}
private void addMultipleNumsRow(int row,
List<Integer> numsInRow,
ConstraintSet conSet,
int[] centerIds) {
int[] buttonsIds = new int[numsInRow.size()];
for (int pos = 0; pos < numsInRow.size(); ++pos) {
int col = numsInRow.get(pos);
Button button = createButton(row, col);
button.setLayoutParams(new ConstraintLayout.LayoutParams(ConstraintLayout.LayoutParams.WRAP_CONTENT,
ConstraintLayout.LayoutParams.WRAP_CONTENT));
int currButtonId = button.getId();
buttonsIds[pos] = currButtonId;
mScreenLayout.addView(button);
if (pos == 0) {
centerIds[row] = currButtonId;
}
}
connectAndChainRow(buttonsIds, conSet);
connectToPrevRow(row, conSet, centerIds);
Log.i(logTag, "Created constrain chain and buttons for row: "
+ row + " number of columns: "
+ numsInRow.size());
}
private void addSingleNumRow(int row,
int num,
ConstraintSet conSet,
int[] centerIds) {
Button button = createButton(row, num);
button.setLayoutParams(new ConstraintLayout.LayoutParams(ConstraintLayout.LayoutParams.WRAP_CONTENT,
ConstraintLayout.LayoutParams.WRAP_CONTENT));
mScreenLayout.addView(button);
centerIds[row] = button.getId();
conSet.connect(button.getId(), ConstraintSet.LEFT, ConstraintSet.PARENT_ID, ConstraintSet.LEFT);
conSet.connect(button.getId(), ConstraintSet.RIGHT, ConstraintSet.PARENT_ID, ConstraintSet.RIGHT);
connectToPrevRow(row, conSet, centerIds);
}
private Button createButton(int row, int col) {
Button resButton = new Button(this);
resButton.setTextAlignment(Button.TEXT_ALIGNMENT_CENTER);
resButton.setText(String.format("(%d, %d)", row, col));
resButton.setId(View.generateViewId());
return resButton;
}
}
2条答案
按热度按时间4sup72z81#
在添加视图之前,您将克隆 ConstraintSet。因此,视图id不会出现在 ConstraintSet 中,并且无法连接。
尝试将下面的行移动到for循环之后。
这可能不会解决所有的问题,但它会帮助你开始。
顺便说一句,如果你还不知道它,“布局检查器”(工具-〉布局检查器)是一个很好的方式来看看你的布局从模拟器或设备。
daolsyd02#
我在代码中发现了一些问题。
首先是Cheticamp指出的bug。我需要调用ConstraintSet.clone()函数,只有在**我已经将 * 所有 * 按钮添加到布局中之后。
然而,在我改变了顺序之后,我仍然把所有的按钮都排在一行,在屏幕的顶部。为了解决这个问题,我不得不为所有按钮添加另一个约束-对于行 R 中的每个按钮,将它的 * 底部 * 连接到该行中心按钮的 * 底部 *,因此所有按钮都将在同一行中对齐。
这解决了我在这段代码中的主要问题!
以下是我的完整工作代码(如果需要,供其他人参考):