Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-15565] Android: MapView displays a black box in TextField

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2013-10-25T22:11:02.000+0000
Affected Version/sn/a
Fix Version/s2013 Sprint 22, 2013 Sprint 22 API, Release 3.2.0
ComponentsAndroid
Labelsandroid, map, module, qe-testadded, ti.map, triage
ReporterMauro Parra-Miranda
AssigneeHieu Pham
Created2013-10-16T10:28:48.000+0000
Updated2014-02-20T10:45:44.000+0000

Description

Problem Description

When adding a textfield and a map in a window with Alloy, you will get a black box in the textfield when focused.

Test Case

index.xml
<Alloy>
	<Window class="container">
		<View id ="mapContainer">
			<View id = "directionView">
				<ImageView id = "searchImg"></ImageView>
				<TextField id = "locationEditText" ></TextField>
				<Button id = "getDirectionBtn" ></Button>
			</View>
			<View id="mapView" ns="Alloy.Globals.Map" platform = "android"></View>
		</View>
	</Window>
</Alloy>
index.js
$.index.open();

Steps to reproduce

Launch the application which has been attached and then perform the following test cases: 1. Launch the application in landscape. 2. Click on the text area. 3. Keyboard is displayed (It should hide the map view entirely) 4. Hide the keyboard. 5. Output: A black box will be displayed in the text field area. This is not displayed if the keyboard is not overlapping the entire map view.

Attachments

FileDateSize
device-2013-10-21-174236.png2013-10-21T12:09:52.000+000056938
SampleEditText.zip2013-10-16T10:28:48.000+00005325259
text_landscape.JPG2013-12-11T10:45:43.000+00003056986
text_portrait.JPG2013-12-11T10:45:43.000+00001968059

Comments

  1. Hieu Pham 2013-10-24

    This is an Android bug (https://code.google.com/p/android/issues/detail?id=11676). Since 4.1, Android changes their map base view from SurfaceView to TextureView, which resolves most of these clipping problems. Unfortunately, this issue still exists with older devices. I will submit a workaround to address this.
  2. Hieu Pham 2013-10-24

    I could not reproduce this issue using the steps described above. Here are the steps that I used to repro: 1. Run the code in description in PORTRAIT mode on ICS devices or below. 2. Click on the textField, keyboard should pop up. 3. Rotate device to LANDSCAPE, observe the black box above the textfield.
  3. Hieu Pham 2013-10-24

    master PR: https://github.com/appcelerator-modules/ti.map/pull/16
  4. Paras Mishra 2013-12-11

    I am able to reproduce this issue on HTC Desire v 4.0.3 using the steps mentioned by Hieu Pham. Screen shots text_landscape.jpg and text_portrait.jpg are attached. It works fine on Google nexus 7 tab v4.3 Environment used: Tested on: Device : Google Nexus 7, Android Version: 4.3 Device : HTC desire V , Android version : 4.0.3 SDK: 3.2.0.v20131210191510 CLI version : 3.2.0-cr OS : MAC OSX 10.9 Alloy: 1.3.0-cr ACS: 1.0.10 Appcelerator Studio, build: 3.2.0.201312101708 titanium-code-processor: 1.1.0-cr XCode : 5.0.2
  5. Pragya Rastogi 2013-12-16

    Verified the fix with: OSX: 10.8.5 Xcode: 5.0 Appcelerator Studio:3.2.0.201312151544 SDK:3.2.0.v20131213102445 alloy: 1.3.0-cr acs: 1.0.10 npm: 1.3.2 titanium: 3.2.0-cr3 titanium-code-processor: 1.1.0-cr2 Device: Nexus 7 (v4.3) & HTC (v4.0.3)

JSON Source