Home Fixed element when using TileView in Android Studio

# Fixed element when using TileView in Android Studio

Timothy Bomer
1#
Timothy Bomer Published in 2018-01-13 00:01:19Z

I am building an activity within Android Studio which uses the TileView library by moagrius to build a layout that can be panned and zoomed, which is all working just fine. I am trying to add an element to the activity which stays fixed at the bottom of the screen and not be affected by the scrolling and zooming of the TileView.

## Points to Note:

• The TileView and content inside of it are all generated and placed programmatically. It does not use an XML layout.
• The element I'm trying to place is an Image. It needs to be in the bottom center of the viewport, and can preferably be reused easily in other activities.

## Things I've Tried:

• I've tried placing the menu button in its own XML file and tried to use the include attribute on the main XML layout file and inflate that via Java. No luck. The bottom menu is still affected.
• I've tried programatically generating the menu button, adding it to a new Relative (tried Linear too) layout, and adding it with parameters to make it sit at the bottom. This got it to appear and stay at the bottom, but it was still affected by zooming and panning.
• I've tried using a FrameLayout to add the tileview on top (tried bottom too) of the Relative or Linear layout containing the button, and it was still affected.

I've tried a few other concepts but they didn't work either.

## layout.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/res"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical"
app:theme="@style/Theme.AppCompat">

</RelativeLayout>


<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:id="@+id/bottompanel">
<RelativeLayout android:layout_height="match_parent"
android:layout_width="match_parent">

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true">

<ImageView
android:id="@+id/imageView3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@drawable/bottombarclosed"
app:srcCompat="@drawable/bottombarclosed" />
</LinearLayout>
</RelativeLayout>
</FrameLayout>


## activity.java

// Initialize TileView, set it's size, and add the detail level (background)
TileView tileView = new TileView(this);
tileView.setSize(5600, 5000);
/*
Generate content for the TileView here.
*/
RelativeLayout rl = new RelativeLayout(this);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
/*
Add the generated content to the Relative Layout for the TileView here.
*/
// Make a new instance of the layout inflator.
LayoutInflater inflater = (LayoutInflater) this.getSystemService(LAYOUT_INFLATER_SERVICE);
// Inflate the bottom menu FrameLayout and save for later.
FrameLayout bm = (FrameLayout) inflater.inflate(R.layout.menu, (ViewGroup) findViewById(R.id.bottompanel));
// Adds the TileView content to the ViewGroup (scaleable, so it can be affected by zooming and panning.)
// Remove the parent from the bottom panel so it can be reassigned. (It crashes without this)
((ViewGroup)bm.getParent()).removeView(bm);
// Add the bottom menu to the tileView without scaling (so it SHOULDN'T be affected by zoom and panning)
// Set the content view to display
setContentView(tileView);


## Update

I got it to stay in the right position by switching

FrameLayout bm = (FrameLayout) inflater.inflate(R.layout.menu, (ViewGroup) findViewById(R.id.bottompanel));


to

RelativeLayout bm = (RelativeLayout) inflater.inflate(R.layout.menu, (ViewGroup) findViewById(R.id.menulrel)); // menurel is an immediate child of the beforementioned FrameLayout


and by adding the TileView to the RelativeLayout instead of the other way around, and setting the content view to the RelativeLayout (bm). Now the issue is, the menu shows for a second, then is hidden when the TileView updates... Hmmm....

Timothy Bomer
2#
Timothy Bomer Reply to 2018-01-13 00:58:02Z
 I finally found the answer! I'm just posting it here just in case somebody else stumbles across this issue. I changed the inflator back to the FrameLayout as it was in the original post. FrameLayout bm = (FrameLayout) inflater.inflate(R.layout.menu, (ViewGroup) findViewById(R.id.bottompanel));  Then added the tileView to the FrameLayout. bm.addView(tileView);  Used the full view to locate the Relative Layout container of the menu (parent of the ImageView), then called bringToFront on it. bm.findViewById(R.id.menurel).bringToFront();  This next step is the MOST IMPORTANT part. You MUST invalidate the RelatieLayout for it to stay present on the screen. Otherwise it fades as the TileView updates and re-renders. bm.findViewById(R.id.menurel).invalidate();  Then lastly, add set your content view to the new FrameLayout with the other views included. setContentView(bm);  I hope this helps somebody out in the future!
 You need to login account before you can post.
Processed in 0.314108 second(s) , Gzip On .