Unexpected clipping in dynamic viewgroup construction

Question

I construct a horizontal scrolled strip with images captured before and I want that items of this strip look like enter image description here

BUT CURRENTLY I SEE JUST enter image description here

The construct process is realized in function:

FrameLayout getImageContainer(){
        //Call custom function from application class to get screen size
        DeviceScreenSize dss = app.getScreenSize();

        //Calculate thumbnail size based on 15% size of the minimum of screen sizes
        //imgWidth and imgHeight are globals to use for thumbnail sizes
        imgWidth = imgHeight = Math.min(dss.getWidth(), dss.getHeight())*15/100;

        //Create container for thumbnail(ImageView) and erase button
        FrameLayout fl = new FrameLayout(this);
        LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        fl.setLayoutParams(params);

        //ImageView containing thumbnail of captured image (has 15% size from min screen side)
        ImageView imv = new ImageView(this);
        imv.setId(R.id.imvFrame);
        imv.setLayoutParams( new LayoutParams( imgWidth, imgHeight ) );
        imv.setScaleType(ScaleType.CENTER_CROP);

        //Button to erase captured image from strip without removing from device (has 7% size from min screen side)
        Button imgClose = new Button(this);
        imgClose.setId(R.id.btnErase);
        imgClose.setBackgroundResource(R.drawable.ic_closebutton);
        params = new LayoutParams(
                        Math.min(dss.getWidth(), dss.getHeight())*7/100, 
                        Math.min(dss.getWidth(), dss.getHeight())*7/100);

        //Snap the center point of imgClose button to the right-top corner of ImageView
        params.topMargin = -Math.min(dss.getWidth(), dss.getHeight())*7/200;
        params.leftMargin = imgWidth-Math.min(dss.getWidth(), dss.getHeight())*7/200;

        imgClose.setLayoutParams( params );

        //Add all children to FrameLayout
        fl.addView(imv);
        fl.addView(imgClose);

        //Add to FrameLayout the additional right-side child as whitespace between different images
        View v = new View(this);
        params = new LayoutParams(Math.min(dss.getWidth(), dss.getHeight())*5/200, imgWidth);
        params.leftMargin = imgWidth+Math.min(dss.getWidth(), dss.getHeight())*7/200;
        v.setLayoutParams(params);
        fl.addView(v);

        return fl;
    }

Next function calls every time after image is captured:

protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);

        if (resultCode == RESULT_OK) {

            switch (requestCode) {
            case CAMERA_IMAGE_REQUEST: {

                //Get image container to place the thumbnail of captured image
                FrameLayout container = getImageContainer();
                ((ImageView)container.findViewById(R.id.imvFrame)).setTag(imageFolderPath + File.separator + imageName);
                ((ImageView)container.findViewById(R.id.imvFrame)).setOnClickListener(openImage);
                ((Button)container.findViewById(R.id.btnErase)).setOnClickListener(eraseImage);

                .......................
                .......................             
                ((ImageView)container.findViewById(R.id.imvFrame)).setImageBitmap(bitmap);
                imvPhotoFrame.addView(container);
            }
            break;
            .......................
            .......................
            }
        }
}

Here, imvPhotoFrame is a LinearLayout:

.............
<HorizontalScrollView
    android:id="@+id/svHorizontalScroll"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scrollbars="horizontal" >

    <LinearLayout
        android:id="@+id/imvPhotoFrame"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:orientation="horizontal" >
    </LinearLayout>
</HorizontalScrollView>
.............

So, what I need to do to obtain the strip from the first image?

score 0 · Answer 1 · answered Oct 15 '14 at 15:18

I feeling really stupid, but the solution of my issue is pretty simple to ask such questions. The point is in the topMargine property so that the correct snippet of the code above is:

ImageView imv = new ImageView(this);
imv.setId(R.id.imvFrame);
params = new LayoutParams(imgWidth, imgHeight);
imv.setLayoutParams(params);

//set positive top margine for ImageView insteed negative one for button imgClose
params.topMargin = Math.min(dss.getWidth(), dss.getHeight())*7/200;

imv.setScaleType(ScaleType.CENTER_CROP);


Button imgClose = new Button(this);
imgClose.setId(R.id.btnErase);
imgClose.setBackgroundResource(R.drawable.ic_closebutton);
params = new LayoutParams(
                    Math.min(dss.getWidth(), dss.getHeight())*7/100, 
                    Math.min(dss.getWidth(), dss.getHeight())*7/100);

//params.topMargin = -Math.min(dss.getWidth(), dss.getHeight())*7/200;
params.leftMargin = imgWidth-Math.min(dss.getWidth(), dss.getHeight())*7/200;

imgClose.setLayoutParams( params );

Unexpected clipping in dynamic viewgroup construction

1 Answers1