안드로이드 브라우저에서 길게 누른 대상을 정확히 구분하기

글 제목을 눌렀는데 이미지 메뉴가 열렸다

웹페이지의 글 제목과 작성자 이미지가 같은 링크 안에 있을 때, 제목을 길게 눌러도 이미지 메뉴가 열리는 경우가 있었습니다. 기존 처리는 WebView가 해당 위치를 이미지 링크로 분류하면 이미지 조회를 먼저 진행했습니다. 사용자가 실제로 누른 곳이 제목인지 이미지인지는 이 정보만으로 구분하기 어려웠습니다.

손가락이 닿은 요소를 다시 확인하다

새 판별기는 길게 누른 화면 좌표에서 웹페이지의 요소를 찾습니다. 좌표를 계산할 때 화면 배율과 확대된 페이지의 이동량을 반영합니다. 누른 곳이 글 제목 같은 텍스트라면 그 요소를 감싼 링크로 연결하고, 이미지 자체라면 화면에 표시된 이미지 주소를 사용합니다. 같은 링크 안에 이미지가 있더라도 직접 누르지 않았다면 이미지 메뉴를 열지 않습니다.

요소를 확인할 수 없는 화면에서는 기존 WebView 판별 경로를 사용합니다. 조회 결과가 도착하기 전에 탭이나 페이지, 터치 위치가 바뀌면 오래된 결과를 버립니다. 이렇게 해야 이전 화면에서 시작한 길게 누르기가 현재 화면의 메뉴를 잘못 열지 않습니다.

링크 메뉴는 어떻게 쓰나

웹페이지의 텍스트 링크를 길게 누르면 누른 위치 근처에 메뉴가 열립니다. 위쪽 카드에는 미리보기와 주소가, 아래쪽 카드에는 링크 동작이 표시됩니다. 긴 주소는 화면에서 줄여 보여주지만 주소를 복사하거나 링크를 열 때는 원래 주소를 사용합니다.

미리보기를 누르면 별도 화면에서 페이지를 확인할 수 있습니다. 미리보기는 요청할 때만 불러오며 접거나 메뉴를 닫으면 해당 화면을 정리합니다. 현재 탭이나 탭 개수는 바뀌지 않습니다. 아래 메뉴에서는 새 탭 또는 비공개 탭으로 열기, 주소·텍스트 복사, 다운로드, 공유, 읽기 목록 추가를 선택할 수 있습니다. 링크에 텍스트가 없으면 텍스트 복사는 비활성화됩니다.

이미지를 길게 누르면 기존 이미지 전용 메뉴가 먼저 열립니다. 링크가 걸린 이미지에서 링크 동작을 쓰려면 이미지 메뉴의 연결된 링크 메뉴를 선택합니다.

미리보기와 기존 조작의 안전장치

미리보기는 탭 기록에 넣지 않는 별도 WebView를 사용합니다. 파일 접근과 위치 정보 사용을 막고 혼합 콘텐츠를 허용하지 않으며, 인증서 오류도 무시하지 않습니다. 미리보기에서 파일 저장이나 외부 앱 실행을 자동으로 시작하지 않고, 다운로드는 사용자가 메뉴에서 따로 선택하도록 했습니다.

개발 기록에는 개발용·검사용 앱 빌드와 정적 검사 통과, 에뮬레이터의 링크·이미지·미리보기 검사 17개 통과가 남아 있습니다. 글 제목과 이미지가 같은 링크에 있는 경우, 서로 다른 링크인 경우, 이미지를 직접 누른 경우도 확인했습니다. 실제 외부 사이트와 개인 휴대폰에서의 조작감은 검증하지 않았습니다.

달라진 사용 경험

이제 길게 누른 위치가 제목이면 링크 메뉴, 이미지면 이미지 메뉴로 이어지도록 구현했습니다. 링크를 바로 열기 전에 미리보기로 확인하거나 주소를 복사할 수도 있습니다. 확인된 결과는 개발용 빌드와 에뮬레이터 검사 범위에 한정됩니다.

#미분류 #이미지 처리 #UI/UX #웹 개발 #보안

댓글 0

    댓글 남기기