Fragment inside ScrollView gives black background flicker

Question

I have LinearLayout in one of my actions as the main layout. I used Scrollview to encapsulate LinearLayout. The layout contains a fragment that displays the google map, but when scrolling it gives a black background. I solved the problem using a transparent background inside FrameLayout. The black background is gone, but during scrolling I get flickering black edges around the map. How to remove this? I tried to set the Scrollview background to white, but no changes were visible.

Activity XML -

<?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/scroll" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#FFFFFF" > <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#FFFFFF" android:baselineAligned="false" android:orientation="vertical" android:overScrollMode="ifContentScrolls" android:scrollbarStyle="insideOverlay" android:scrollbars="vertical" android:showDividers="none" > <RelativeLayout android:layout_width="match_parent" android:layout_height="45dp" android:background="#ec4d1d" > <TextView android:id="@+id/friend_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_marginLeft="7dp" android:background="@drawable/near_you_bg" android:gravity="center_horizontal|center_vertical" android:padding="6dp" android:textColor="#FFFFFF" android:textSize="15sp" android:textStyle="bold" android:typeface="sans" /> <Button android:id="@+id/btnInviteFriends" android:layout_width="30dp" android:layout_height="25dp" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="7dp" android:background="@drawable/menu_bg" android:onClick="inviteFriends" /> </RelativeLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="81dp" android:background="@drawable/list_bg" android:orientation="vertical" > <TableLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:shrinkColumns="*" android:stretchColumns="*" > <TableRow android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center_vertical|center_horizontal" android:layout_marginTop="4dp" android:gravity="center_vertical|center_horizontal" > <RelativeLayout android:layout_width="65dp" android:layout_height="70dp" > <ImageView android:id="@+id/user_image" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_alignWithParentIfMissing="false" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:layout_marginTop="7dp" android:src="@drawable/d_bg" /> </RelativeLayout> <RelativeLayout android:layout_width="140dp" android:layout_height="70dp" > <TextView android:id="@+id/name" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="0dp" android:layout_toRightOf="@id/user_image" android:paddingBottom="2dip" android:text="Amrinder" android:textColor="#000000" android:textSize="16sp" android:textStyle="bold" /> <TextView android:id="@+id/distance" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/name" android:layout_marginTop="2dp" android:layout_toRightOf="@id/user_image" android:text="description" android:textColor="#000000" android:textSize="10sp" > </TextView> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/distance" android:layout_marginTop="7dp" android:orientation="horizontal" > <ImageView android:id="@+id/common_icon" android:layout_width="26dp" android:layout_height="19dp" android:background="@drawable/common_icon" /> <TextView android:id="@+id/common_number" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="3dp" android:text="4" android:textColor="#000000" android:textStyle="bold" /> <ImageView android:id="@+id/friends_icon" android:layout_width="26dp" android:layout_height="19dp" android:layout_marginLeft="7dp" android:background="@drawable/friends_icon" /> <TextView android:id="@+id/friends_number" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="3dp" android:text="5" android:textColor="#000000" android:textStyle="bold" /> </LinearLayout> <TextView android:id="@+id/nearUserInfo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:visibility="invisible" > </TextView> </RelativeLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" > <TextView android:id="@+id/time_ago" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="10 min ago" /> <ImageView android:id="@+id/dir_img" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/time_ago" android:layout_centerHorizontal="true" android:layout_marginTop="23dp" android:background="@drawable/say_hi_button" /> </RelativeLayout> </TableRow> </TableLayout> </RelativeLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="5dp" > <ImageView android:id="@+id/map_bar" android:layout_width="fill_parent" android:layout_height="25dip" android:layout_centerInParent="false" android:layout_gravity="center_horizontal" android:background="@drawable/map_box_bg" /> <RelativeLayout android:layout_width="fill_parent" android:layout_height="25dp" > <TextView android:id="@+id/distance_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_marginLeft="1dp" android:text="X is 4 km north-east of you now" android:textColor="#ffffff" android:textStyle="bold" /> </RelativeLayout> <FrameLayout android:id="@+id/frame_layout" android:layout_width="match_parent" android:layout_height="match_parent" > <fragment android:id="@+id/map" android:name="com.google.android.gms.maps.MapFragment" android:layout_width="fill_parent" android:layout_height="150dp" android:layout_below="@id/map_bar" /> <View android:id="@+id/trans_img" android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/trans" /> </FrameLayout> </RelativeLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" > <ImageView android:id="@+id/like_bar" android:layout_width="fill_parent" android:layout_height="25dip" android:layout_gravity="center_horizontal" android:background="@drawable/map_box_bg" /> <RelativeLayout android:layout_width="fill_parent" android:layout_height="25dp" > <ImageView android:id="@+id/like_button" android:layout_width="24dp" android:layout_height="23dp" android:layout_centerVertical="true" android:layout_marginLeft="1dp" android:background="@drawable/common_detail_icon" /> <TextView android:id="@+id/likes_in_common" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_toRightOf="@id/like_button" android:gravity="center_vertical" android:text=" 3 likes in common" android:textColor="#FFFFFF" android:textStyle="bold" /> </RelativeLayout> <ImageView android:id="@+id/like_bg" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/like_bar" android:layout_gravity="center_horizontal" android:background="@drawable/list_bg" /> </RelativeLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" > <ImageView android:id="@+id/friends_bar" android:layout_width="fill_parent" android:layout_height="25dip" android:layout_gravity="center_horizontal" android:background="@drawable/map_box_bg" /> <RelativeLayout android:layout_width="fill_parent" android:layout_height="25dp" android:layout_alignParentRight="true" > <ImageView android:id="@+id/friends_button" android:layout_width="24dp" android:layout_height="23dp" android:layout_centerVertical="true" android:layout_marginLeft="1dp" android:background="@drawable/common_friends_icon" /> <TextView android:id="@+id/friends_in_common" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_toRightOf="@id/friends_button" android:gravity="center_vertical" android:text=" 9 friends in common" android:textColor="#FFFFFF" android:textStyle="bold" /> </RelativeLayout> <ImageView android:id="@+id/friends_bg" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/friends_bar" android:layout_gravity="center_horizontal" android:background="@drawable/list_bg" /> </RelativeLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" > <ImageView android:id="@+id/friends_bar" android:layout_width="fill_parent" android:layout_height="25dip" android:layout_gravity="center_horizontal" android:background="@drawable/map_box_bg" /> <RelativeLayout android:layout_width="fill_parent" android:layout_height="25dp" android:layout_alignParentRight="true" > <ImageView android:id="@+id/friends_button" android:layout_width="24dp" android:layout_height="23dp" android:layout_centerVertical="true" android:layout_marginLeft="1dp" android:background="@drawable/common_friends_icon" /> <TextView android:id="@+id/friends_in_common" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_toRightOf="@id/friends_button" android:gravity="center_vertical" android:text=" 9 friends in common" android:textColor="#FFFFFF" android:textStyle="bold" /> </RelativeLayout> <ImageView android:id="@+id/friends_bg" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/friends_bar" android:layout_gravity="center_horizontal" android:background="@drawable/list_bg" /> </RelativeLayout> <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_margin="5dp" > <ImageView android:id="@+id/friends_bar" android:layout_width="fill_parent" android:layout_height="25dip" android:layout_gravity="center_horizontal" android:background="@drawable/map_box_bg" /> <RelativeLayout android:layout_width="fill_parent" android:layout_height="25dp" android:layout_alignParentRight="true" > <ImageView android:id="@+id/friends_button" android:layout_width="24dp" android:layout_height="23dp" android:layout_centerVertical="true" android:layout_marginLeft="1dp" android:background="@drawable/common_friends_icon" /> <TextView android:id="@+id/friends_in_common" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_toRightOf="@id/friends_button" android:gravity="center_vertical" android:text=" 9 friends in common" android:textColor="#FFFFFF" android:textStyle="bold" /> </RelativeLayout> <ImageView android:id="@+id/friends_bg" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_below="@id/friends_bar" android:layout_gravity="center_horizontal" android:background="@drawable/list_bg" /> </RelativeLayout> </LinearLayout> </ScrollView> 

Answer 1

Instead of using a transparent image above the map fragment, you are trying to use becauz transparent color, I also ran into the same problem and I decided to use this method.

 android:background="@android:color/transparent" 

But technically speaking, as suggested by Android, you should not use a scrollable element inside another scrollable element. Instead, you can use the Google map map API to display a static map inside a scroll, and when you click on the scroll, you can open the google map scroll in a new window.

Answer 2

The reason for this is that Map uses SurfaceView, when the application creates this view, it creates a Window behind your activity and hits a hole, which indicates that things in your Activity window are not visible below the original SurfaceView location.

For me it works like a charm, you can use this library

https://github.com/NyxDigital/NiceSupportMapFragment/