Creating and Adding dynamic views in Relative layout inside FrameLayout

Question

What I'm doing is something like this

<Dynamic Framelayout >
    <Dynamic Relaive Layout>

       <Dynamic imageView>
       <Dynamic TextView>

    </Dynamic Relaive Layout>
</Dynamic Framelayout>

I have created the layout and placed the views as I discussed above.

But Now I want to textview should be placed below the image view

here what I m getting.

notice the RED textviews. this should be below the imageview and horizontally centered.

Here is my Code.

final FrameLayout main = (FrameLayout) findViewById(R.id.add_dynamic_views_frame);
int numViews = drawbbleIds.length;
for (int i = 0; i < numViews; i++) {

    RelativeLayout rel_inner = new RelativeLayout(SplashSearch.this);

    rel_inner.setGravity(Gravity.CENTER_HORIZONTAL);

    ImageView imgView = new ImageView(SplashSearch.this);

    TextView textView = new TextView(SplashSearch.this);

    imgView.setImageDrawable(getResources().getDrawable(drawbbleIds[i]));

    imgView.setTag(i);
    imgView.setId(i);
    imgView.setOnClickListener(SplashSearch.this);

    rel_inner.addView(imgView);

    RelativeLayout.LayoutParams imgLp = (RelativeLayout.LayoutParams) imgView
            .getLayoutParams();

    textView.setTag(i);
    textView.setId(i);

    textView.setText(getResources().getStringArray(R.array.tabs_names)[i]);

    textView.setTextColor(Color.RED);

    rel_inner.addView(textView);

    RelativeLayout.LayoutParams txtLp = (RelativeLayout.LayoutParams) textView
            .getLayoutParams();

    imgLp.addRule(RelativeLayout.BELOW, textView.getId());

    textView.setLayoutParams(imgLp);

    FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(70, 70);

    // Place all views in the center of the
    // layout. We'll transform them
    // away from there in the code below.
    lp.gravity = Gravity.CENTER;

    // Set layout params on view.
    rel_inner.setLayoutParams(lp);

    // Calculate the angle of the current
    // view.
    // Adjust by 90 degrees to
    // get View 0 at the top. We need the
    // angle
    // in degrees and radians.
    float angleDeg = i * 360.0f / numViews - 90.0f;
    float angleRad = (float) (angleDeg * Math.PI / 180.0f);

    rel_inner.setTranslationX(250 * (float) Math.cos(angleRad));
    rel_inner.setTranslationY(250 * (float) Math.sin(angleRad));

    main.addView(rel_inner);
}

Answer 1

Try using this code:

 final FrameLayout main = (FrameLayout) findViewById(R.id.frame);
            int numViews = 5;
            for (int i = 0; i < numViews; i++) {

                RelativeLayout rel_inner = new RelativeLayout(this);

                rel_inner.setGravity(Gravity.CENTER_HORIZONTAL);

                ImageView imgView = new ImageView(this);

                imgView.setImageDrawable(getResources().getDrawable(
                        R.drawable.ic_launcher));

                imgView.setTag(i);
                imgView.setId(i + 1);
                // imgView.setOnClickListener(SplashSearch.this);

                rel_inner.addView(imgView);

                RelativeLayout.LayoutParams imgLp = new RelativeLayout.LayoutParams(
                        LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);

                TextView textView = new TextView(this);
                textView.setTag(i);
                textView.setId(i);
                textView.setText("" + i);

                textView.setTextColor(Color.RED);
                imgLp.addRule(RelativeLayout.BELOW, imgView.getId());
imgLp.addRule(RelativeLayout.CENTER_HORIZONTAL);
                textView.setLayoutParams(imgLp);

                rel_inner.addView(textView);

                FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(70,
                        LayoutParams.WRAP_CONTENT);

                // Place all views in the center of the
                // layout. We'll transform them
                // away from there in the code below.
                lp.gravity = Gravity.CENTER;

                // Set layout params on view.
                rel_inner.setLayoutParams(lp);

                // Calculate the angle of the current
                // view.
                // Adjust by 90 degrees to
                // get View 0 at the top. We need the
                // angle
                // in degrees and radians.
                float angleDeg = i * 360.0f / numViews - 90.0f;
                float angleRad = (float) (angleDeg * Math.PI / 180.0f);

                rel_inner.setTranslationX(250 * (float) Math.cos(angleRad));
                rel_inner.setTranslationY(250 * (float) Math.sin(angleRad));

                main.addView(rel_inner);
            }

It works well.Hope it will help you.

Answer 2

You are setting LayoutParams after you add the Views to the RelativeLayout.

textView.setLayoutParams(imgLp);

First set LayoutParams as above, and then add Views to the RelativeLayout.

rel_inner.addView(imgView);
rel_inner.addView(textView);

Edit: Try copy pasting this code. I couldn't test since I don't have resources, files, etc but this should do the trick.

    final FrameLayout main = (FrameLayout) findViewById(R.id.add_dynamic_views_frame);
    int numViews = drawbbleIds.length;
    for (int i = 0; i < numViews; i++) {

        RelativeLayout rel_inner = new RelativeLayout(SplashSearch.this);

        FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(70, 70);

        // Place all views in the center of the
        // layout. We'll transform them
        // away from there in the code below.
        lp.gravity = Gravity.CENTER;

        // Set layout params on view.
        rel_inner.setLayoutParams(lp);

        ImageView imgView = new ImageView(SplashSearch.this);

        TextView textView = new TextView(SplashSearch.this);

        imgView.setImageDrawable(getResources().getDrawable(drawbbleIds[i]));

        imgView.setTag(i);
        imgView.setId(i);
        imgView.setOnClickListener(SplashSearch.this);

        RelativeLayout.LayoutParams imgLp = (RelativeLayout.LayoutParams) imgView
                .getLayoutParams();

        imgLp.addRule(RelativeLayout.CENTER_HORIZONTAL);
        imgView.setLayoutParams(imgLp);

        rel_inner.addView(imgView);

        textView.setTag(i);
        textView.setId(i);

        textView.setText(getResources().getStringArray(R.array.tabs_names)[i]);

        textView.setTextColor(Color.RED);

        RelativeLayout.LayoutParams txtLp = (RelativeLayout.LayoutParams) textView
                .getLayoutParams();

        txtLp.addRule(RelativeLayout.CENTER_HORIZONTAL);
        txtLp.addRule(RelativeLayout.BELOW, imgView.getId());
        textView.setGravity(Gravity.CENTER);
        textView.setLayoutParams(txtLp);

        rel_inner.addView(textView);

        // Calculate the angle of the current
        // view.
        // Adjust by 90 degrees to
        // get View 0 at the top. We need the
        // angle
        // in degrees and radians.
        float angleDeg = i * 360.0f / numViews - 90.0f;
        float angleRad = (float) (angleDeg * Math.PI / 180.0f);

        rel_inner.setTranslationX(250 * (float) Math.cos(angleRad));
        rel_inner.setTranslationY(250 * (float) Math.sin(angleRad));

        main.addView(rel_inner);
    }

Answer 3

Use LinearLayout instead of RelativeLayout here.