How to position 6 image buttons in a row in an activity

Question

I am currently building a mastermind game app in android, and I need to position the 6 base colour buttons in a row but I have some errors

current xml code for the image buttons:

<ImageButton
            android:layout_width="50px"
            android:layout_height="40px"
            android:id="@+id/selectblackpeg"
            android:src="@mipmap/blackpeg"
            android:layout_above="@+id/buttonMainMenu"
            android:layout_alignRight="@+id/textGuesses"
            android:layout_toLeftOf="@+id/selectyellowpeg"
            android:layout_alignEnd="@+id/textGuesses"
            android:layout_marginBottom="50dp" />

        <ImageButton
            android:layout_width="50px"
            android:layout_height="40px"
            android:id="@+id/selectyellowpeg"
            android:src="@mipmap/yellowpeg"
            android:layout_toRightOf="@+id/selectblackpeg"
            android:contentDescription="yellowpeg"
            android:layout_alignTop="@+id/selectbluepeg" />

        <ImageButton
            android:layout_width="50px"
            android:layout_height="40px"
            android:id="@+id/selectbluepeg"
            android:src="@mipmap/bluepeg"
            android:layout_toRightOf="@+id/selectyellowpeg"
            android:layout_toEndOf="@+id/textGuesses" />

        <ImageButton
            android:layout_width="50px"
            android:layout_height="40px"
            android:id="@+id/selectredpeg"
            android:src="@mipmap/redpeg"
            android:layout_toRightOf="@+id/selectbluepeg"
            android:layout_toStartOf="@+id/buttonMainMenu" />

        <ImageButton
            android:layout_width="50px"
            android:layout_height="40px"
            android:id="@+id/selectgreenpeg"
            android:src="@mipmap/greenpeg"
            android:layout_toLeftOf="@+id/selectredpeg"
            android:layout_toStartOf="@+id/selectwhitepeg" />

        <ImageButton
            android:layout_width="50px"
            android:layout_height="40px"
            android:id="@+id/selectwhitepeg"
            android:src="@mipmap/whitepeg"
            android:layout_alignLeft="@+id/selectgreenpeg"
            android:layout_alignStart="@+id/selectyellowpeg" />

and the error message that comes up is:

java.lang.IllegalStateException: Circular dependencies cannot exist in RelativeLayout at android.widget.RelativeLayout$DependencyGraph.getSortedViews(RelativeLayout.java:1724) at android.widget.RelativeLayout.sortChildren(RelativeLayout.java:382) at android.widget.RelativeLayout.onMeasure(RelativeLayout.java:389) at android.view.View.measure(View.java:18788) at android.widget.RelativeLayout.measureChildHorizontal(RelativeLayout.java:715) at android.widget.RelativeLayout.onMeasure(RelativeLayout.java:461) at android.view.View.measure(View.java:18788) at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951) at android.widget.FrameLayout.onMeasure(FrameLayout.java:194) at android.support.v7.internal.widget.ContentFrameLayout.onMeasure_Original(ContentFrameLayout.java:135) at android.support.v7.internal.widget.ContentFrameLayout.onMeasure(ContentFrameLayout.java) at android.view.View.measure(View.java:18788) at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:5951) at android.support.v7.internal.widget.ActionBarOverlayLayout.onMeasure_Original(ActionBarOverlayLayout.java:393) at android.support.v7.internal.widget.ActionBarOverlayLayout.onMeasure(ActionBarOverlayLayout.java) at android.view.View.measure(View.java:18788) at android.widget.RelativeLayout.measureChildHorizontal(RelativeLayout.java:715) at android.widget.RelativeLayout.onMeasure(RelativeLayout.java:461) at android.view.View.measure(View.java:18788) at com.android.layoutlib.bridge.impl.RenderSessionImpl.measureView(RenderSessionImpl.java:470) at com.android.layoutlib.bridge.impl.RenderSessionImpl.render(RenderSessionImpl.java:357) at com.android.layoutlib.bridge.Bridge.createSession(Bridge.java:428) at com.android.ide.common.rendering.LayoutLibrary.createSession(LayoutLibrary.java:350) at com.android.tools.idea.rendering.RenderTask$2.compute(RenderTask.java:510) at com.android.tools.idea.rendering.RenderTask$2.compute(RenderTask.java:498) at com.intellij.openapi.application.impl.ApplicationImpl.runReadAction(ApplicationImpl.java:888) at com.android.tools.idea.rendering.RenderTask.createRenderSession(RenderTask.java:498) at com.android.tools.idea.rendering.RenderTask.access$600(RenderTask.java:72) at com.android.tools.idea.rendering.RenderTask$3.call(RenderTask.java:610) at com.android.tools.idea.rendering.RenderTask$3.call(RenderTask.java:607) at com.android.tools.idea.rendering.RenderService.runRenderAction(RenderService.java:366) at com.android.tools.idea.rendering.RenderTask.render(RenderTask.java:607) at com.android.tools.idea.rendering.RenderTask.render(RenderTask.java:629) at com.intellij.android.designer.designSurface.AndroidDesignerEditorPanel$6.run(AndroidDesignerEditorPanel.java:480) at com.intellij.util.ui.update.MergingUpdateQueue.execute(MergingUpdateQueue.java:320) at com.intellij.util.ui.update.MergingUpdateQueue.execute(MergingUpdateQueue.java:310) at com.intellij.util.ui.update.MergingUpdateQueue$2.run(MergingUpdateQueue.java:254) at com.intellij.util.ui.update.MergingUpdateQueue.flush(MergingUpdateQueue.java:269) at com.intellij.util.ui.update.MergingUpdateQueue.flush(MergingUpdateQueue.java:227) at com.intellij.util.ui.update.MergingUpdateQueue.run(MergingUpdateQueue.java:217) at com.intellij.util.concurrency.QueueProcessor.runSafely(QueueProcessor.java:238) at com.intellij.util.Alarm$Request$1.run(Alarm.java:351) at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:511) at java.util.concurrent.FutureTask.run(FutureTask.java:266) at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1142) at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:617) at java.lang.Thread.run(Thread.java:745)

One view is related to second and second is related to the first. Circular dependency. Kind of a dead-lock situation. — Rohit5k2, Feb 11 '16 at 13:21

score 0 · Answer 1 · answered Feb 11 '16 at 13:08

remove circular dependency from your controls.

<ImageButton
        android:id="@+id/selectblackpeg"
        android:layout_toLeftOf="@+id/selectyellowpeg"/>

    <ImageButton
        android:id="@+id/selectyellowpeg"
        android:layout_toRightOf="@+id/selectblackpeg" />

you have given that selectblackpeg will be in left of selectyellowpeg and selectyellowpeg will be in right of selectblackpeg.

Give dependency to only one control.

score 0 · Answer 2 · edited May 23 '17 at 12:23

The problem is caused because there is a circular reference in the layout parameters.

For example, when view B is layout_below view A, view A can't reference view B anymore in it's below, alignRight etc. This can also exist between multiple views: A references B references C. In that scenario C can't reference A because of a circular dependency.

Check this as it is a similar question: Circular dependencies cannot exist in RelativeLayout, android?

Spirrow · Answer 3 · 2016-02-11T14:33:57.470

0

Your problem is that you are creating circular dependencies, it says in the first line of the error. You are calling from the first imageButton to the second imageButton, and from that second button you are calling again to the first one, making a circular reference.

Remove android:layout_toLeftOf="@+id/selectyellowpeg" from the first ImageButton

edited Feb 11 '16 at 14:33

answered Feb 11 '16 at 13:11

Spirrow

1,120
6
18

score 0 · Answer 4 · edited Feb 11 '16 at 13:53

This exception seems that you are using Relative layout as parent. This Circular dependency occurs when you make two children in the same layout dependent on each other.

To remove such dependency please remove one of android:layout_toLeftOf="@+id/selectyellowpeg" or android:layout_toRightOf="@+id/selectblackpeg" from the following set and run.

    <ImageButton
        android:id="@+id/selectyellowpeg"
        android:layout_toRightOf="@+id/selectblackpeg" />

score 0 · Answer 5 · answered Feb 11 '16 at 13:44

0

You should put the buttons in a horizontal LinerLayout

answered Feb 11 '16 at 13:44

Teodora

11
3

How to position 6 image buttons in a row in an activity

5 Answers5