how to fix this imageview error? - android

Allow me to explain. I have :
a button with picture (located at #drawable/pic),
linear layout (id=linear1)
the button xml is below :
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginRight="10dp"
android:scaleType="fitXY"
android:src="#drawable/pic"
android:maxWidth="80dp"
android:maxHeight="80dp"
tools:ignore="ContentDescription" />
the linear layout xml is as follow :
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="80dp"
android:gravity="center"
android:orientation="horizontal"
tools:ignore="UselessLeaf" >
what i want is, when i click the button i want to create/generate imageview programatically inside the linearlayout and i want to fill it with the same picture for the button (pic). The code is below :
//initiate imageview
ImageView img=new ImageView(this);
//get drawable from button
Drawable blabla=btn1.getDrawable();
//set drawable to imageview
img.setImageDrawable(blabla);
//set height and width of imageview to 50dp
LinearLayout.LayoutParams parms = new LinearLayout.LayoutParams(50,50);
img.setLayoutParams(parms);
img.setScaleType(ScaleType.FIT_XY);
//place imageview to linearlayout
layoutTempat.addView(img);
The code works fine with displaying the imageview with the same image as the button have.
however the problem is : when i set the imageview to 50dp programatically, the image inside button changed too.. how can it happened ? i am so confused as iam a newbie..
Thanks before.

The two views are sharing the same drawable.
It's plausible your manipulations on one view are being sent to the underlying drawable, effecting how its displayed in the other view -- frankly I don't know. But assuming the case is as you described, this problem is easily fixed by cloning the drawable as follows:
Drawable dr = btn1.getDrawable().getConstantState().newDrawable();
img.setImageDrawable(dr);

Related

how to fit an ImageView inside a CardView

I have a fixed size CardView, and I need to fill it with an ImageView, this is how the code looks so far:
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card1x"
android:layout_width="160dp"
android:layout_height="170dp">
<ImageView
android:id="#+id/futourImage"
android:src="#drawable/futourfie"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.CardView>
And in order to fit it, tried :
ImageView futour = (ImageView)findViewById(R.id.futourImage);
futour.setScaleType(ImageView.ScaleType.FIT_XY);
But doesn't seems to solve the problem, looking for an effective solution! Thanks
Fixed it by changing :
ImageView image_id = (ImageView)findViewById(R.id.ImageID);
image_id.setScaleType(ImageView.ScaleType.CENTER_CROP);
and setting :
android:layout_width="match_parent"
android:layout_height="match_parent"
for the ImageView
Have a layout like relative layout as the main child of the CardView and then have the ImageView the child view of the layout. Then set the ImageView's width and height to match_parent.
You could also alternatively have a framelayout as the main child of the CardView and set its background to the image. Will stretch it up to fill the Card.

How to create imageviews dynamically?

Hello everyone. I need to create something like this,displayed in a picture. I have no idea how should I implement it?.
If I press camera button and add photo - it must be added to that list.
I think to create a row of invisible ImageView and initialize them when it needed, but I think it is bad solution.
you can use this way to create the imageviews dynamically:
ImageView iv=new ImageView(context);
iv.setId(id);
iv.layout(l, t, r, b);
l,t,r and b specify the padding from left,top,right and bottom respectively
then you can add this imageview to your respective layout
There is lots of ways to do. Use first portion as ListView and second portion as customized GridView if any data changes update both listview and gridview adapter.
Use this after image get captured
//LinearLayOut Setup
LinearLayout linearLayout= new LinearLayout(this);
linearLayout.setOrientation(LinearLayout.HORIZONTAL);
linearLayout.setLayoutParams(new LayoutParams(
LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT));
//ImageView Setup
ImageView imageView = new ImageView(this);
//setting image resource
imageView.setImageResource(R.drawable.play);
//setting image position
imageView.setLayoutParams(new LayoutParams(
LayoutParams.MATCH_PARENT,
LayoutParams.WRAP_CONTENT));
//adding view to layout
linearLayout.addView(imageView);
//make visible to program
setContentView(linearLayout);
You can add views dynamically that you defined default values in xml for using an inflater. The "parent" in the code below should be a ViewGroup like a Linear or RelativeLayout, or even a GridLayout.
You can probably use a LinearLayout with horizontal orientation to get the effect you are looking for.
LayoutInflater inflater = getActivity().getLayoutInflater();
final ImageView iv = (ImageView) inflater.inflate(R.layout.imageview_thumb, parent, false);
//Zero means its in the back;
parent.addView(iv, 0);
Layout Code:
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/imageview_fc"
android:layout_width="142dp"
android:layout_height="142dp"
android:scaleType="fitCenter"
android:layout_marginLeft="5dp"
android:background="#android:color/transparent"
/>
create a gallery to show the image horizontally. when you capture image, write it to a folder and read all files from that folder. each time when you capture image you need to refresh gallery data. if you want a image with cross button then create a separate xml file like below
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FF8825">
<ImageView
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FF2225"/>
<ImageButton
android:id="#+id/crossButton"
android:layout_marginRight="5dp"
android:layout_marginTop="5dp"
android:background="#android:color/transparent"
android:layout_gravity="top|right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/btn_dialog_normal"/>
and inflate it for each gallery item

How to make a view as always on top?

I have a TextView and it is on an image. When I click the button, TextView's background color will change, but image won't disappear. For example:
My TextView at the beginning:
When I click a button:
If you want to do this using only one TextView then its may be not possible. So, I will suggest you to do this using FrameLayout. you can write your layout as below.
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FFFFFF" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="" />
</FrameLayout>
When you want to change the color behind the TextView then change the ImageView background as below...
ImageView mageView view = (ImageView) findViewById(R.id.image);
view.setBackgroundColor(Color.BLUE);
If it must be a TextView and an ImageView you could also wrap it within a FrameLayout (which is supposed to contain only one child). A FrameLayout will place all containing children elements on the same "place", so the get overlapped.
Or when you need more elements, you could also use a RelativeLayout and give your elements the same layout rules (e.g. all centered).
You should use ImageView instead of TextView, the:
public void onClick(View v){
imageView.setBackgroundColor(Color.GREEN);
}
ImageButton is better option for you.Image source will be star as u said.then onclick you change the background. if want set Text in this
android:drawableTop="#drawable/any_drawable"
android:text="#string/any_text"

Drag and Drop component on ImageView

Can any one help me to know how to add TextField on ImageView Dynamically. And drag them to any position on that ImageView as we want...
I think the Drag and Drop Blog will help you. In which i have dragged image as well as text both on touch event of fingure.
Check out the Code HERE
You can create a relative layout as container of your imageView (or directly set your image as relativeLayout background) like in this manner:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/relativeLayout">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/imageView"
android:src="#drawable/your_image"
android:layout_centerHorizontal="true" />
<RelativeLayout>
and programatically, you get your imageView and add the textView to that:
RelativeLayout relativeLayout = (relativeLayout) findViewById(R.id.relativeLayout);
ImageView iv_myImage = (ImageView) findViewById(R.id.imageView);
// Create new textView
TextView textView = new TextView(context);
// Here set style on textView
// Finally add textView to imageView
relativeLayout.addView(textView);
About drag and drop there's plenty topics about.. see
http://www.techrepublic.com/blog/software-engineer/try-androids-useful-drag-and-drop-api/
drag and drop textview

View overlapping another view in LinearLayout

I have a wierd problem.
I define a LinearLayout with vertical orientation.
I define an ImageView and another custom View.
if I add the custom one and then the image, all is fine and I see both of them.
if I add the image one first, I see only the image.
I try any variation of LayoutParams and nothing worked.
what I'm doing wrong here?
Edit - I even tried some default button to check its not my custom view that causing this
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
layout = new LinearLayout(getApplicationContext());
layout.setOrientation(LinearLayout.VERTICAL);
layout.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
ImageView image = new ImageView(getApplicationContext());
image.setImageDrawable(getResources().getDrawable(R.drawable.image_strip));
Button button = new Button(getApplicationContext());
button.setText("test");
layout.addView(image, new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
layout.addView(button, new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
setContentView(layout);
}
I found a way, but its still has an issue.
I used RelativeLayout, and aligned the button to the bottom of the parent (the layout) and I set the image to be above the button.
now I see both of them, but the problem now is that the image width also shrinks
How big is your image? If its bigger than the view area, its going to push the button off screen. If the button is first, you'll see it. If the button is after the image, you won't. That would be my first guess. You could wrap the whole thing (the parent LinearLayout) in a ScrollView to see if its doing that. If so, you'll need to clip the image somehow.
If the image is bigger than the screen size, try the following. Create the parent LL as you have it, then create a ScrollView and add the image inside that. Set the layout_weight of the ScrollView to 1 (or whatever), and DON'T set the layout_weight of the button. This should force the ScrollView to take up as much space as possible, but leave room for the button, and allow you to scroll to see the image.
I don't have good code off hand for doing this in code. I do most layout in XML (and not to pontificate, but I'd suggest the same for you ;)
<ProgressBar
android:layout_height="50dp"
android:layout_width="50dp"
android:id="#+id/myprogress"
android:layout_gravity="center_horizontal"
android:visibility="gone"
style="#android:style/Widget.Holo.Light.ProgressBar.Small"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_below="#+id/title" />
<ImageView
android:layout_height="165dp"
android:id="#+id/imageView1"
android:layout_width="125dp"
android:scaleType="fitXY"
android:visibility="invisible"
android:layout_marginTop="-30dp"
android:layout_gravity="center_horizontal"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"/>
Check for the above layout of progressbar and imageview. What I wanted was to overlap the imageview over progressbar and I achieved the same by setting android:layout_marginTop="-30dp" to imageview

Categories

Resources