Expand an edittext dynamically

Question

I would like to do the following on Android:

1. Click on an image --> an icon on the touched spot should appear
2. When I click that spot again, an EditText should appear
3. This EditText should expand dynamically when I type in stuff
4. The original image should be saved with the EditText and the text that I typed in

What would be the best way to accomplish that?

To my knowledge the image can be set to an onClickListener/onTouchListener, and once onClick/onTouch is called, I should be able to add an icon to that location, where the icon is an image and is set to an onTouchListener as well. When I click on that image, an edittext should appear - not sure how to make it expand dynamically though? Once the text is entered and a button is clicked, the entire image - with the text in the edittext - should be saved - how would I do that? Draw on a canvas?

Help would be highly appreciated! :)

Answer 1

Step 1

Your Views should be inside a RelativeLayout in order to place them top of each other. When you press your ImageView, small one will be set to Visible (it must be invisible inside xml file or programmatically).

imgV.setOnClickListener(new OnClickListener() {

    @Override
    public void onClick(View v) {
        imageViewButton.setVisibility(View.VISIBLE);
    }
});

Step 2

When you press small image, EditText will become visible. Same as instucted above.

imageViewButton.setOnClickListener(new OnClickListener() {

    @Override
    public void onClick(View v) {
        editText.setVisibility(View.VISIBLE);
    }
});

Step 3

Your EditText expands automatically when typing if you set width to match_parent and height to wrap_content.

<EditText
    android:id="@+id/editText1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:ems="10" >

</EditText> 

Step 4

When you want to save your Layout, implement this in your onClick event. (In the example below, it is a LinearLayout but you will have a RelativeLayout, I suppose you can change it according to your needs)

According to the answer on How to save the layout view as image or pdf to sd card in android?

Add permission in the manifest file

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

Use the code below

LinearLayout content = findViewById(R.id.rlid);
content.setDrawingCacheEnabled(true);
Bitmap bitmap = content.getDrawingCache();
File file,f;                    
if (android.os.Environment.getExternalStorageState().equals(android.os.Environment.MEDIA_MOUNTED)) 
    {  
         file =new File(android.os.Environment.getExternalStorageDirectory(),"TTImages_cache");
         if(!file.exists())
        {
          file.mkdirs();

         } 
         f = new File(file.getAbsolutePath()+file.seperator+ "filename"+".png");
    }
  FileOutputStream ostream = new FileOutputStream(f);                                   
  bitmap.compress(CompressFormat.PNG, 10, ostream);
  ostream.close();

 } 
 catch (Exception e){
 e.printStackTrace();
}