We Keep Coding

Dynamically created TextView in FrameLayout has no width

I'm trying to add a TextView in code to a framelayout. This sits above an imageview in the z order of the framelayout. The ultimate aim is to allow the creation of a screenshot from the framelayout that shows the image and the text that has been overlayed on to it. I have this working when using a textview created in xml but not in the dynamic code version. The create bitmap method returns an error complaining about the width of the textbox being 0. In the code below I am trying to capture just the textview as an image to identify what the issue is, as the captured image from the framelayout did not contain the contents of the textview as expected. In doing this I was able to find the width error and I believe it is this that is the root of the problem. I have tried to set the textview's width using setWidth and also using the LayoutParams. The end result is always that the textview has no width although it can be seen on the handset clearly. I think I am missing something between the dynamic creation and the existing xml which results in the 0 width. Can anyone point me in the correct direction please?
The code is as follows
public void applyTextToImage(View view) {
// Do something in response to button
//Hide the virtual keyboard
InputMethodManager inputManager = (InputMethodManager) getSystemService(this.INPUT_METHOD_SERVICE);
inputManager.hideSoftInputFromWindow(getCurrentFocus().getWindowToken(), InputMethodManager.HIDE_NOT_ALWAYS);
//Get the text to overlay on the image
EditText editText = (EditText) findViewById(R.id.edit_message);
String message = editText.getText().toString();
//Bring the overlay layout to the front
//LinearLayout overlay_layout = (LinearLayout) findViewById(R.id.image_Overlay_Layout);
//overlay_layout.bringToFront();
//Apply the new text to the text box
/* Old code to get the view that is shown in the layout
TextView text_overlay = (TextView) findViewById(R.id.image_Overlay);
text_overlay.bringToFront();
text_overlay.setText(message);
*/
//New code to create a view dynamically instead
TextView text_Overlay = new TextView(this);
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN_MR1) {
text_Overlay.setId(Utils.generateViewId());
}
else
{
text_Overlay.setId(TextView.generateViewId()); //static class
}
FrameLayout image_Layout = (FrameLayout) findViewById(R.id.image_Layout);
//View image_Layout = (View) findViewById(R.id.image_Layout);
//FrameLayout.LayoutParams fParams = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT,FrameLayout.LayoutParams.WRAP_CONTENT);
FrameLayout.LayoutParams fParams = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT,FrameLayout.LayoutParams.WRAP_CONTENT);
fParams.gravity = Gravity.CENTER;
// text_Overlay.setMaxWidth(image_Layout.getWidth());
// text_Overlay.setWidth(image_Layout.getWidth());
//image_Layout.addView(text_Overlay, fParams);
image_Layout.addView(text_Overlay, fParams);
Toast.makeText(this,"TextView Width: " + text_Overlay.getWidth(),Toast.LENGTH_LONG).show();
//TODO: Something has forced the dynamic layout to not be saved in the bitmap try removing the params and set the values on the textview itself
//TODO: for some reason the width keeps coming back as 0 could be that the image_Layout is 0 too
text_Overlay.setGravity(Gravity.CENTER);
text_Overlay.setTextAlignment(View.TEXT_ALIGNMENT_CENTER);
float pixels = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 10, getResources().getDisplayMetrics());
//text_Overlay.setWidth(250dp);
text_Overlay.setTextSize(pixels);
text_Overlay.setTextColor(Color.RED);
text_Overlay.bringToFront();
text_Overlay.setText(message);
text_Overlay.setVisibility(View.VISIBLE);
//End of new dynamic code
if (folderCheck()){
try {
String filePath = getFilePath();
int myId = text_Overlay.getId();
Bitmap bitmap;
View v1 = findViewById(myId);
v1.setDrawingCacheEnabled(true);
v1.buildDrawingCache();
bitmap = Bitmap.createBitmap(v1.getDrawingCache());
v1.setDrawingCacheEnabled(false);
// End imported code
streamBitmapToFile(bitmap, filePath);
}
catch (Exception e)
{
Toast.makeText(this,e.getMessage(),Toast.LENGTH_LONG);
Log.e("Bitmap Creation","Couldn't create bitmap error as: " + e.toString());
}
}
}
XML contents
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="false">
<!--app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_my"-->
<EditText android:id="#+id/edit_message"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:hint="#string/edit_message"
android:enabled="false"/>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"
android:onClick="applyTextToImage"
android:enabled="false"
android:id="#+id/overlayButton"/>
</LinearLayout>
<FrameLayout
android:id="#+id/image_Layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true">
<ImageView
android:id="#+id/image_View"
android:layout_width="match_parent"
android:layout_height="250dp" />
<!--<TextView
android:id="#+id/image_Overlay"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textAlignment="center"
android:textSize="25dp"
android:textColor="#ff0000"/>-->
</FrameLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="false"
android:gravity="bottom"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/open_gallery"
android:onClick="openGallery">
</Button>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/new_image"
android:onClick="newImage">
</Button>
</LinearLayout>
</RelativeLayout>

The view has not been measured yet. Until the system does another layout pass, the view reports its width as zero.
In my opinion, you are better off leaving the TextView in the XML layout and simply making it invisible (android:visibility="invisible") until you need it, then make it visible prorammatically with setVisbility(View.VISIBLE). (Note that if you set it to be gone, it will also not be measured.)

For reference Karakuri pointed out the weaknesses and the path to follow to resolve them.
Extra code that was implemented for the listener is as follows.
IMAGE_CAPTURE_REQUESTED = true;
// New Listener
ViewTreeObserver vto = image_Layout.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
image_Layout.getViewTreeObserver().removeGlobalOnLayoutListener(this);
}
else
{
image_Layout.getViewTreeObserver().removeOnGlobalLayoutListener(this);
}
if (IMAGE_CAPTURE_REQUESTED) {
//int myId = text_Overlay.getId();
//Toast.makeText(MyActivity.this, "Text Overlay Width " + text_Overlay.getWidth() ,Toast.LENGTH_LONG).show();
overlayTextAndExportImage();
}
}
}); //End New Listener
The new overlayTextAndImportImage calls all the image creation routines after the layout has been redrawn.

How can I create a layout with imageviews overlapping?

I'm trying to add Imageviews dynamically and
I would like to create this kind of layout, with ImageViews overlapping, for
my android application.
I don't know how to set the overlapping in java code. I want to use java code becouse I'm adding Imageview dynamically!
this is the code that I did:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/frame1">
</RelativeLayout>
and this is my java code:
RelativeLayout layout = (RelativeLayout) findViewById(R.id.frame1);
RelativeLayout.LayoutParams params1 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
mImageView = new ImageView (this);
mImageView.setId(1);
name = "0" + ".jpg";
Bitmap bitmap = BitmapFactory.decodeFile(url_image+name);
params1.addRule(RelativeLayout.ALIGN_PARENT_TOP,1);
params1.addRule(RelativeLayout.ALIGN_PARENT_LEFT,1);
params1.addRule(RelativeLayout.ALIGN_PARENT_START,1);
params1.addRule(RelativeLayout.ALIGN_TOP,1);
mImageView.setImageBitmap(bitmap);
layout.addView(mImageView,params1);
for (int i = 1;i < num_max; i++){
mImageView = new ImageView (this);
mImageView.setId(i+1);
name = String.valueOf(i) + ".jpg";
int id = mImageView.getId() - 1 ;
bitmap = BitmapFactory.decodeFile(url_image+name);
mImageView.setImageBitmap(bitmap);
RelativeLayout.LayoutParams params2 = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
params2.addRule(RelativeLayout.BELOW,id);
params2.addRule(RelativeLayout.ALIGN_START,id);
params2.addRule(RelativeLayout.ALIGN_LEFT,id);
layout.addView(mImageView,params2);
}

If you want to images overlapping each other(as i understood from your question) you should remove this line :
params2.addRule(RelativeLayout.BELOW,id);
If you wanted something else feel free to post comment below this answer

Use relative layout for it
use this code
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/iv_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/iv"
/>
</RelativeLayout>

Following is the example of how to achieve it.
MainActivity.Java
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RelativeLayout layout = (RelativeLayout) findViewById(R.id.frame1);
//Add first image view
ImageView mImageView = new ImageView (this);
mImageView.setId(1);
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.color1);
RelativeLayout.LayoutParams params1 = new RelativeLayout.LayoutParams(300, 300);
mImageView.setImageBitmap(bitmap);
layout.addView(mImageView,params1);
//Add second image view
ImageView mImageView2 = new ImageView (this);
mImageView2.setId(2);
Bitmap bitmap2 = BitmapFactory.decodeResource(getResources(), R.drawable.color2);
mImageView2.setImageBitmap(bitmap2);
RelativeLayout.LayoutParams params2 = new RelativeLayout.LayoutParams(300,300);
params2.setMargins(150, 150, 0, 0);
layout.addView(mImageView2,params2);
}
}
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.sample.MainActivity" >
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/frame1">
</RelativeLayout>
</RelativeLayout>
Output Screenshot:
Required Images:

Imageview element disappers on selecting the link

I have a XML file with a imageview as follows. It also has a TextView anmed "linksend".
<ImageView
android:id="#+id/imgview1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
/>
I have a Java file as as follows
ImageView imageView=(ImageView)rootView.findViewById(R.id.imgview1);
URL url;
url = new URL(someurlforimage);
Bitmap bmp;
bmp = BitmapFactory.decodeStream(url.openConnection().getInputStream());
imageView.setImageBitmap(bmp);
TextView tv=(TextView)rootView.findViewById(R.id.linksend);
tv.append(Html.fromHtml("" +"Press link"+""));
tv.setMovementMethod(LinkMovementMethod.getInstance());
The image disappears from the imageview when the html link is pressed. Though the html page opens in a separate browser, the app's image becomes empty.

Is it possible for Google Maps Info Window to overlap the Marker

I've been researching how to do this for quite some time now and I can't find a single solution, it seems like no one has even tried this before. I'm trying to do the following:
This is how the marker looks like:
And this is how I want it to look like when the Info Window pops up:
Is there a way for the Info Window to overlap the marker like this and hide a part of it?
Note: The second image is just a model of the design (photoshopped), it is not yet implemented. The first image is the actual screenshot.

Here is your code to add custom marker images.
LayoutInflater inflater = (LayoutInflater) getApplicationContext()
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
marker=inflater.inflate(R.layout.custom_marker_layout,null, false);
numTxt = (TextView) marker.findViewById(R.id.num_txt);
for(int i=0;i<locations.size();i++){
numTxt.setText(count.get(i).toString());
numTxt.setTextColor(Color.GREEN);
if(Integer.parseInt(count.get(i).toString())<=5){
numTxt.setTextColor(Color.RED);
}
String title=locations.get(i).toString()+"count"+count.get(i);
Currnt=mMap.addMarker(new MarkerOptions()
.icon(BitmapDescriptorFactory.fromBitmap(createDrawableFromView(BasicMapActivity2.this, marker))).
position(new LatLng(Double.parseDouble(latitudes.get(i).toString()), Double.parseDouble(longitudes.get(i).toString())))
.title(title)
.snippet(address.get(i)));
markers.add(Currnt);
mMap.animateCamera(CameraUpdateFactory.newLatLngZoom(new LatLng(Double.parseDouble(latitudes.get(i).toString()), Double.parseDouble(longitudes.get(i).toString())), 12.0f));
}
and method to convert view into bitmap in google map.
// Convert a view to bitmap
public static Bitmap createDrawableFromView(Context context, View view) {
DisplayMetrics displayMetrics = new DisplayMetrics();
((BasicMapActivity2)context).getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
view.setLayoutParams(new LayoutParams(200,65));
view.measure(displayMetrics.widthPixels, displayMetrics.heightPixels);
view.layout(0, 0, displayMetrics.widthPixels, displayMetrics.heightPixels);
view.buildDrawingCache();
view.buildDrawingCache(true);
Bitmap bitmap = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
view.draw(canvas);
return bitmap;
}
and Custom_marker_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical|center_horizontal" >
<ImageView
android:id="#+id/img"
android:layout_width="55dp"
android:layout_height="65dp"
android:src="#drawable/custom_marker" />
<TextView
android:id="#+id/num_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="9"
android:textColor="#008000"
android:textSize="18dp"
android:textStyle="bold" />
</FrameLayout>
Here in this implementation i show custom image and in this image one textview with count value and when i click on marker then it's show my custom window.

ImageView.setImageURI() resets layout?

I'm passing the URI of the resource I want to use to the activity that's supposed to display it with a description. Here's the code:
public void onClick(View v) {
final String root = "android.resource://" + getPackageName() + "/";
Intent myIntent = new Intent( v.getContext(), SingleMoveView.class);
myIntent.setData(Uri.parse(root + R.drawable.simby));
myIntent.putExtra("Desc", getResources().getString(R.string.simbus));
startActivity(myIntent);
}
and in the SingleMoveView class:
ImageView view = (ImageView) findViewById(R.id.singleMoveView);
TextView text = (TextView) findViewById(R.id.singleMoveDesc);
Uri path = getIntent().getData();
String desc = getIntent().getStringExtra("Desc");
view.setImageURI(path);
text.setText(desc);
What's happening is I've set up the ImageView and TextView in the XML as such:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:theme="#android:style/Theme.Holo.NoActionBar">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/singleMoveView"
android:layout_margin="20dp"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:textAppearance="?android:attr/textAppearanceMedium"
android:id="#+id/singleMoveDesc"
android:layout_margin="20dp"
android:layout_below="#+id/singleMoveView"
android:layout_alignParentLeft="true"/>
</RelativeLayout>
But it's displaying the image in the absolute center of the screen:
Instead of on top w/text underneath. [Note the picture isn't displayed. view.setImageURI(path); was commented out]
Help please? How do I get it to display properly. Thanks! ^_^

Problem solved. It was an issue with the dimensions of the picture. I had to resize it...