How use the mapView in activity? - android

In my application am use include other layout to include two view in main XML,in that first view have simple text view only and in second view i have map view.In my main XML file i have two buttons when i click first button to show first view with text view,when i click second button i want to hide the first view and to show second view with map view.I don't know how to show the map view in main activity.Can any one know please help me to solve this problem.

Firstly tell what version of google maps do you use
v1 - https://developers.google.com/maps/documentation/android/v1/
v2 - https://developers.google.com/maps/documentation/android/start
Usually what you need to do is to put you two layouts inside FrameLayout and show/hide one of them when you click on particular button. But to be more specific we need to see your code.

1) MapView is used by GoogleMapsV1. But it needs an api key provided by google for individual developers upon registration.
Unfortunately, which is closed by google and you have to use GoogleMapV2 with new V2 key.
Also, workout with fragments because, here we are using Fragment or SupportFragment.
2) You can use a FrameLayout inside which your two overlapped views with id's. So that you can show or hide views at same position as you need.

Please try to use bellow code.
<LinearLayout
android:id="#+id/buttonLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button2" />
</LinearLayout>
<ViewFlipper
android:id="#+id/viewFliper"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/buttonLayout" >
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.google.android.maps.MapView
android:id="#+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:apiKey="your map key map_key"
android:clickable="true"
android:enabled="true"
android:focusable="true"
android:focusableInTouchMode="true" />
</ViewFlipper>

Related

Android: replace one view with another

What I need in general: replace(hide) one view with another by a button click
Let's go deep in details:
I use ViewPager, which consists of 100 images.
Layout of ViewPager
<?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="wrap_content"
android:layout_height="wrap_content"
>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:background="#ffffff" >
</android.support.v4.view.ViewPager>
<ImageButton
android:id="#+id/imagePlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageRight"
android:layout_alignTop="#+id/imageList"
android:src="#drawable/list" />
</RelativeLayout>
Layout of Image
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="1dip"
android:background="#ffffff">
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
/>
</RelativeLayout>
It works - no problems. But I need to add button to the viewpager and after tapping image in the viewpager should be changed to the gif. It looks like gifs preview and after onclick play - gif starts to play.
Custom layout for gifs:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageList"
android:layout_marginRight="28dp"
android:layout_toLeftOf="#+id/imageRight" >
<com.basv.gifmoviewview.widget.GifMovieView
android:id="#+id/gif1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
How it should be resolved? It's pretty simple for me to open another activity after tapping to the button, but the issue is to play gif in the same Fragment
Any ideas?
I'd simply add your com.basv.gifmoviewview.widget.GifMovieView somewhere to your root RelativeLayout (perhaps you may need to wrap both ViewPager and GifMovieView in additional FrameLayout) and simply show/hide it when needed using ordinary setVisibility().
EDIT
I suppose it's not the best solution for phones' memory usage
I quickly looked into the sources and there's no much code really. So if you bother memory usage you can always dynamically create widget prior showing it (and destroy once hidden) or, as I cannot see the method to "unload" a GIF, you can always use "1x1 px" empty Gif to ensure last one you just stopped showing is no longer occupying precious memory if not needed.
Here is an idea. Make that layout with both view pager and gif but the gif visibility set to invisible so that initially its there but not visible. But when someone click the button you should put that gif to life in code by setting it to visible while also changing view pager to invisible or gone in case you dont even want its initial boundary being present!!

How to display google map in right half of the screen while left half of the screen contain list view

i am working on a app, where i need to display the google map on the right half of the screen of my device. The left half of the screen contain text in list view format. Please help me how to design the UI part or layout.xml.....Thanks in advance..!!!
Use linear layout with horizontal orientation and put both your mapview and listview inside it , now give similar weight to them .May be that will work .for example give layout_weight 1 or 0.5 in both mapview and listview .
Try use Fragments and here are some links to training
Using Fragments in Android
trading for fragments
Maybe you could look into something like this? I've used this format in apps before
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:gravity="center"
android:orientation="vertical">
<MapView />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:gravity="center"
android:orientation="vertical">
<ListView />
</LinearLayout>

Android - Make a LinearLayout which contains a ListView scrollable

I know that everyone's recommended that we should never use ListView and ScrollView together, and I totally agree. However, I'm currently stuck with a very simple pattern like 8tracks' profile page (as shown in the image below), which include an area for the user profile and a list of mixes they made. So basically, it's desirable that users can just scroll down that page, which means the profile part will get on top of the screen and gradually out of view, and at the same time the below list is scrolled too:
However, at the moment, all I can do is to include a ListView within a LinearLayout, just like my sketch here.
With this design, I can only scroll the list down, while the profile area stays at the same place, which sucks. So I'm looking for any idea to make the whole page scrollable, not just the list. Please help and thanks.
EDITED: I'm sorry for the misleading question. My problem is even more complicated because the content of the tabs are not just ListView - some tab contains LinearLayout or GridView instead. Again, what I want to achieve is to make the whole page scrollable, but ScrollView can't help because if the content of a tab is a ListView or GridView, these views will be collapsed and more importantly - this goes against the design rule.
I know this is late, but I'm the current developer for 8tracks. The (old) 2.x app you have shown above is being rewritten, but I can show you what the old dev did for the profile page.
Before going into that I must say that this is not the best way to do this, but the 8tracks app (2.x) is old.
So back to the code…
The ProfileActivity contains a ProfileFragment.
The main layout you see with the Follow button (and the profile image) is this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- Image, name, location -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="10dip" >
<com.gdub.widget.ImageViewClickable
android:id="#+id/dj_avatar"
android:layout_width="110dip"
android:layout_height="110dip"
android:layout_marginRight="10dip"
android:background="#drawable/default_avatar_max200"
android:scaleType="centerCrop" />
<com.gdub.widget.CollapsingTextView
android:id="#+id/dj_location"
style="#style/mix.counts"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dip"
android:layout_toRightOf="#id/dj_avatar" />
<ViewSwitcher
android:id="#+id/profile_action_btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/dj_location"
android:layout_toRightOf="#id/dj_avatar" >
<Button
android:id="#+id/follow_btn"
style="#style/white_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/follow" />
<Button
android:id="#+id/edit_profile_btn"
style="#style/white_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/edit_profile" />
</ViewSwitcher>
</RelativeLayout>
<TextView
android:id="#+id/dj_bio"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="-25dip"
android:gravity="left|center_vertical"
android:lineSpacingExtra="2dip"
android:paddingLeft="10dip"
android:paddingRight="10dip"
android:textColor="#color/default_text"
android:textSize="15sp" />
<include
android:id="#+id/profile_tabs"
layout="#layout/profile_tabs" />
</LinearLayout>
And profile_tabs…
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:orientation="horizontal">
<include
android:id="#+id/profile_mixes_button"
layout="#layout/profile_tab" />
<include
android:id="#+id/profile_followers_button"
layout="#layout/profile_tab" />
<include
android:id="#+id/profile_following_button"
layout="#layout/profile_tab" />
</LinearLayout>
So as you can see it's a regular layout with three buttons "simulating" tabs.
The contents of the tabs is also dictated by a ViewSwitcher:
<?xml version="1.0" encoding="utf-8"?>
<ViewSwitcher xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/profile_view_switcher"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:inAnimation="#anim/fade_in_300"
android:outAnimation="#anim/fade_out_300"
android:background="#color/white">
<include
android:id="#+id/profile_loading"
layout="#layout/loading_view_full" />
<ListView
android:id="#+id/profile_content_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:cacheColorHint="#00000000"
android:divider="#null"
android:dividerHeight="0dip"
android:fadingEdge="none" />
</ViewSwitcher>
That shows a loading wheel and then switches to the listview. There is no other scrollable ViewGroup.
And that's basically it.
Now if you wanted to make the WHOLE thing scroll, then you need to use a custom adapter and set the above layout as the Header (or at least use getItemType in the adapter in a clever way). That way the whole screen is a List (with all the optimizations a list has).
We (ab)use this in the new 8tracks App under dev. ;)
Try to use the following on your listview.
listview.addHeaderView(v);
Also rememeber, you must call this method before calling setAdapter() on your listview.
include your linearlayout where you have the user details and the tabs and add it as a header to the list.
You can try to make the profile and the tabs the header of the listview, then updating the contents of the listview when the tabs are pressed. I don't know if you want the tabs to disappear from view as you scroll, though.
According to the UI guide lines and best practices, it is advisable not to use Scrollable content inside Scrollview and doing that prevents the scrolling of the Scrollable content.
When you put two scrollview android just get confused which scroll view is touched. So sometimes it gets unable to deliver touch event.
But if still you want to achieve the scrolling functionality you can manage it by using the onTouch event of the particular view. And you need to design your layout accordingly.
But even if the requirement forces you to make such layouts. Try this…
Say case is somewhat like this….
<ScrollView android:id=”#+id/parent_scroll”
android:layout_width=”fill_parent”
android:layout_height=”wrap_content”
android:layout_weight=”1″
android:background=”#drawable/dotted_bg”
android:focusableInTouchMode=”false”>
<LinearLayout />
<LinearLayout />
<LinearLayout >
<ScrollView android:id=”#+id/child_scroll”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
android:background=”#drawable/text_box_bg”>
<TextView android:id=”#+id/text_description”
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”
android:textColor=”#color/gray”
android:textSize=”12dip”
android:padding=”5dip”
android:scrollbars=”vertical”/>
<!–ScrollView>
</LinearLayout>
Step 1 : Provide unique id to both the scrollview.
Step 2 : get reference of that two scrollview in your activity.
parentScroll=(ScrollView)findViewById(R.id.parent_scroll);
childScroll=(ScrollView)findViewById(R.id.child_scroll);
Step 3: Now set touch listeners for both.
parentScroll.setOnTouchListener(new View.OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
Log.v(TAG,”PARENT TOUCH”);
findViewById(R.id.child_scroll).getParent().requestDisallowInterceptTouchEvent(false);
return false;
}
});
childScroll.setOnTouchListener(new View.OnTouchListener() {
public boolean onTouch(View v, MotionEvent event)
{
Log.v(TAG,”CHILD TOUCH”);
// Disallow the touch request for parent scroll on touch of child view
v.getParent().requestDisallowInterceptTouchEvent(true);
return false;
}
});
I hope it will help you.

allow user to add/delete buttons and buttons automatically shifts positions

i would like to create a flexible user interface for the android platform.
basically my layout would consist of a image button with at "plus" sign at the beginning.
when teh user clicked it. another layout is called where the user is prompt to name the image button that is suppose to be created.When the user clicks confirm, he'll e brought back to the 1st layout and the newly added image button would replace the position of the "plus" sign image button and the plus sign image button would shift to the right.
i know how to create the layout initially but i dunno how to programmed it to function the way i described above.
ok so now i have my main layout file set this way:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
<RelativeLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#000000" >
<ImageButton
android:id="#+id/addRoom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="25dp"
android:layout_marginTop="38dp"
android:background="#80000000"
android:src="#drawable/plus" />
<TextView
android:id="#+id/textView1"
android:layout_width="#+id/addRoom"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/addRoom"
android:layout_alignRight="#+id/addRoom"
android:layout_below="#+id/addRoom"
android:text="#string/add_room"
android:gravity="center"
android:textColor="#FFFFFF" />
</RelativeLayout>
</ScrollView>
would i have any issues when i include the fragments to shift the image button and textview when the alignment instructions to both of it.
When you want to manipulate your activity's UI in real time by the user it's recommended to use Fragments and Fragment Manager to change diffident parts of your activity's view.
You can find great information in the docs:
http://developer.android.com/guide/components/fragments.html
or
http://marakana.com/s/post/1250/android_fragments_tutorial
in your case you would do some thing like that:
fragmentTransaction = fragmentManager.beginTransaction();
fragmentTransaction.remove(plusButtonFragment)
.add(R.id.containerForFragments,userNewFragment)
.add(R.id.containerForFragments, plusButtonFragment)).commit();
after you have created the plusButtonFragment and the userNewFragment.
Update:
For managing the fragments location in a relative layout check out the next post:
How to add fragments programmatically in relativelayout

how to show TextView,Buttons On MapView (To Overlap On It)..?

In my application i have mapview and I want to show distance in a textview and also a Button ,
I have done this.and tried this..
http://www.anddev.org/post3452.html#p3452
PROBLEM IS>>>>
I WANT TO SHOW TEXTVIEW AND BUTTON OVER THE MAP VIEW..
so I can See MAPVIEW in Full Screen..with other items over it(as we can see map through textview)..
Any SPECIFICATION NEEDED TO BE DONE IN xml FILE..??
Please..Reply me..
Thank You..in advance
Yes you can do that.
For eg:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<com.google.android.maps.MapView
android:id="#+id/mapView" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:enabled="true"
android:layout_centerInParent="true" android:clickable="true"
android:apiKey="your api key" />
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Click"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true" android:id="#+id/clickBtn" />
</RelativeLayout>
create a layout with the RelativeLayout and embed the map view in it. Once set, set the relative position of your components as per your need.

Categories

Resources