2011-09-16 3 views
0

간단한 Android 레이아웃 질문이 있습니다.화면 크기에 관계없이 이미지를 서로 겹치게하려면 어떻게해야합니까?

크기가 480x800 인 이미지를 찍습니다. 이미지는 수행하지만 세부 사항이있는 이미지를 선호합니다. 이 이미지를 large.png이라고합니다.

이제 임의의 이미지 부분을 잘라내어 새 이미지에 잘라 붙여 넣은 다음 small.png이라고 부릅니다.

그런 다음 두 이미지를 가져 와서 전체 이미지의 배경으로 큰 이미지를 놓고 작은 이미지를 퍼즐과 같은 다른 이미지와 일치하도록 시도하여 하나만 가지고있는 것처럼 보입니다. 영상.

쉬운 해결책은 (당신이 FrameLayout의로 배경을 설정 한 경우, 또는 1)을 FrameLayoutImageViews 2를 가질 수 있으며, 단지 작은 ImageView 약간의 여백 값을 줄 것입니다. 예를 들면 다음과 같습니다.

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout android:layout_width="fill_parent" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_height="fill_parent"> 

    <ImageView android:layout_width="fill_parent" 
     android:layout_height="fill_parent" android:background="@drawable/large" 
     android:layout_gravity="top|left" /> 

    <ImageView android:layout_width="wrap_content" 
     android:layout_gravity="top|left" android:layout_height="wrap_content" 
     android:background="@drawable/small" android:layout_marginLeft="100dp" 
     android:layout_marginTop="100dp" /> 

</FrameLayout> 

이 값은 최소한 현재 테스트중인 장치의 해상도에 맞아야합니다. 화면 해상도가 다른 다른 장치에서이 솔루션을 사용하거나 현재 방향의 방향을 변경하는 경우 문제가 발생합니다.

또 다른 가능한 해결책은 여백을 사용하는 대신에 무게의 힘을 줄 수있는 복수의 LinearLayouts을 갖는 것입니다. 그러나이 솔루션은 지저분하고 XML (및 메모리 사용량)이 더 커지고 항상 작동하지는 않습니다. 계산상의 한계로 인해 작은 이미지에 빈 공간을 만들 수 있습니다.

이 문제를 해결하는 가장 좋은 해결책은 무엇입니까? OpenGL 사용을 피하려고합니다.

찾을 수있는 유일한 해결책은 작은 이미지를 다른 이미지의 마스크처럼 설정하는 것이므로 다른 이미지와 크기가 같고 주위에 빈 공간이 있습니다. 하지만 항상 가능하지는 않습니다. 때로는 처리 할 이미지가 많으며이 규칙을 따르지 않는 경우가 있습니다.


더 구체적으로 : 그들이에 표시되는 것을 화면에 상관없이, 완벽하게 맞지하지 않도록

내가 다른 이미지 위에 이미지를 넣어 싶습니다.

예를 들어 얼굴 이미지가 있고 크기가 같은 여러 개의 눈 이미지가있는 경우 얼굴 사이를 전환하여 얼굴 눈을 변경할 수 있습니다.


어쩌면 내가 처음에 작성해야 : 그들이에 표시되는 것을 화면에 상관없이, 완벽하게 맞지하지 않도록

내가 다른 이미지 위에 이미지를 넣어 싶습니다. 예를 들어 얼굴 이미지가 있고 여러 개의 눈 - 동일한 크기의 이미지가있는 경우 얼굴의 눈을 변경하기 위해 여러 개의 눈 - 이미지를 전환 할 수 있습니다.


나는 이것도 간단했다.나는 그것을 다른 방식으로 해결하려고 노력했다. 필요할 경우 전 세계적으로 그것을 해결할 것이다. 나는 원 스크린과 현재 스크린의 비율에 따라 모든 것을 스케일하려고 했으므로, 한 스크린에서 잘 작동한다면, 모든 것이 가능해야한다. 다른 모든 화면에서 확장하십시오. 일반적으로 제대로 작동하지만 때로는 빈 공간이 어디에도 없습니다. 계산 오류 때문이거나 화면 간의 다른 종횡비 때문일 수 있습니다. 여기에서이 코드를 확인하고 잘못된 점을 알려주십시오. (btw,이 코드는 dp가 다른 밀도 당 px 크기를 변경하므로 모든 치수 단위가 px가 아니라 dp 인 경우에만 작동합니다.) :

public class GlobalPercentageLayoutTestActivity extends Activity 
    { 
    private static final int DEFALT_TARGET_WIDTH =480,DEFALT_TARGET_HEIGHT=800; 
    private int    targetWidth; 
    private int    targetHeight; 
    private static int  screenWidth,screenHeight; 

    public int convertToNewXCoordinate(int x) 
    { 
    int newX=x*screenWidth/this.targetWidth; 
    return newX; 
    } 

    public int convertToNewYCoordinate(int y) 
    { 
    int newY=y*screenHeight/this.targetHeight; 
    return newY; 
    } 

    @Override 
    public void onCreate(Bundle savedInstanceState) 
    { 
    super.onCreate(savedInstanceState); 
    DisplayMetrics metrics=new DisplayMetrics(); 
    getWindowManager().getDefaultDisplay().getMetrics(metrics); 
    screenWidth=metrics.widthPixels; 
    screenHeight=metrics.heightPixels; 
    this.targetWidth=DEFALT_TARGET_WIDTH; 
    this.targetHeight=DEFALT_TARGET_HEIGHT; 
    View root=getLayoutInflater().inflate(R.layout.main,null); 
    prepare(root); 
    setContentView(root); 
    } 

    private void scaleSingleView(View v) 
    { 
    LayoutParams lp=v.getLayoutParams(); 
    if(lp!=null) 
     { 
     // set margins: 
     if(lp instanceof MarginLayoutParams) 
     { 
     MarginLayoutParams ml=(MarginLayoutParams)lp; 
     int t=ml.topMargin,b=ml.bottomMargin,l=ml.leftMargin,r=ml.rightMargin; 
     ml.setMargins(convertToNewXCoordinate(l),convertToNewYCoordinate(t),convertToNewXCoordinate(r),convertToNewYCoordinate(b)); 
     } 
     // set size: 
     int w=lp.width,h=lp.height; 
     if(w!=ViewGroup.LayoutParams.FILL_PARENT&&w!=ViewGroup.LayoutParams.WRAP_CONTENT&&w!=ViewGroup.LayoutParams.MATCH_PARENT) 
     lp.width=convertToNewXCoordinate(w); 
     if(h!=ViewGroup.LayoutParams.FILL_PARENT&&h!=ViewGroup.LayoutParams.WRAP_CONTENT&&h!=ViewGroup.LayoutParams.MATCH_PARENT) 
     lp.height=convertToNewYCoordinate(h); 
     // set padding: 
     int t=v.getPaddingTop(),b=v.getPaddingBottom(),l=v.getPaddingLeft(),r=v.getPaddingRight(); 
     t=convertToNewYCoordinate(t); 
     b=convertToNewYCoordinate(b); 
     l=convertToNewXCoordinate(l); 
     r=convertToNewXCoordinate(r); 
     v.setPadding(l,t,r,b); 
     } 
    } 

    private void prepare(View v) 
    { 
    scaleSingleView(v); 
    if(v instanceof ViewGroup) 
     { 
     ViewGroup parent=(ViewGroup)v; 
     int numberOfChildren=parent.getChildCount(); 
     for(int i=0;i<numberOfChildren;++i) 
     { 
     View view=parent.getChildAt(i); 
     prepare(view); 
     } 
     } 
    } 
    } 

너희들, 난 당신이 내가 설명하고있어 문제를 이해 생각하지 않는다, 그래서 내가 수수께끼의 방법을 설명합니다.

다음이 개 이미지를 가지고, 그들은 각 other.notes 맞도록, 퍼즐처럼 2 imageViews를 사용하여 함께 넣어 :

1. 가장 중요한 것은 : 이미지가 한 많은 공간을 채우기 만들기 현재보기 화면 해상도를 기반으로 가능하고 다른보기 (레이아웃 포함)를 넣을 수도 있기 때문에 imageViews뿐 아니라 모든보기 (여백, 패딩, 크기)의 종횡비 유지 및 모든 가능한 해상도에서 솔루션 작동 가능

2. "large.png"라는 이미지는 배경에 있어야하고 "small.png"라는 이미지는 다른 하나의 내부에 있어야만 구멍이 채워집니다.

3. 작은 이미지가 큰 이미지의 전체 구멍에 맞도록 구멍 내부에 빈 공간이 없어야합니다. 이것은 스케일링을 달성하는 데 성공했기 때문에 중요하지만, 왜 빈 공간이 있는지 (안드로이드의 샘플링 문제로 인한 것일 수 없음), 심지어 가중치를 통해서도 찾을 수 없었습니다. & linearLayout 트릭. 여기에 내가 여기에 작성한 코드를 사용하여 성공했는지의 예 : http://imageshack.us/photo/my-images/402/testvk.png/

4.bonus : 그것은, 심지어 런타임시 작동하게 내가 특정 마진 런타임에 새보기를 넣으면 있도록, 패딩 및 크기를 조정하면 화면 해상도에 따라 자동으로 해당 속성을 조정합니다. 너무 어렵다면, 레이아웃에 넣기 전/후에 새로 작성한 뷰로 무엇을해야하는지 알려주세요.

5.opengl, surfaceView 등은 훌륭하지만 내가 찾고있는 것이 아닙니다. 간단한 안드로이드 뷰를 사용하여 모든 해상도에서 작동하는 솔루션을 원합니다. 예를 들어, 좋은 예가되기를 바란다면, 안드로이드 웹 브라우저를 사용하여 html에 특별한 모바일 태그가없는 웹 사이트를 검색하십시오. 사용 가능한 공간에 따라 모든 것이 확장되기 때문에 시도하는 모든 장치에서 웹 사이트가 동일하게 표시되는 것을 볼 수 있습니다.

여기에 모든 이미지입니다 http://imageshack.us/g/703/largee.png/

지금은 모두가 내 질문이 무엇인지 이해할 수 있기를 바랍니다.

+0

실행중인 문제에 대해 더 자세히 설명해 주실 수 있습니까? – emmby

+0

나는 더 많은 정보를 추가했지만 사회자가 그것을 삭제하고 메인 포스트에 두 번 넣었다. 중재자, PM에 대한 방법을 모르기 때문에 업데이트를 병합하십시오. 여기에서 해당 부분을 제거 할 수도 있습니다. 어쨌든 내가 말하고있는 문제는 안드로이드가 더러운 트릭을하지 않는 한, 모든 활동을 자동으로 조절할 수 없다는 것입니다. 이것은 실제로 누락 된 기능이며, 여백과 패딩에는이 때문에 많은 목적이 없습니다. maybe on android 4 Google이 태블릿 및 기타 기기의 Android를 병합 할 계획이므로 상황이 이렇게되지는 않습니다. –

+0

내 대답을 내 편집으로 봅니다. 어쩌면 도움이 될 것입니다 –

답변

1

당신은 코드에서해야 할 것 :

디스플레이 크기 (또는 이미지의 컨테이너의 크기)을 결정합니다.

그런 다음 이미지 디스플레이/컨테이너 크기의 비율을 계산하십시오. 이렇게하면 오버레이 이미지의 크기를 조정해야하는 비율이 달라집니다.

마지막으로 계산 된 비율을 사용하여 다시 오버레이를 배치해야하는 위치의 크기 조정 좌표를 계산합니다.

당신은

당신은 XML에 ImageViews에 매개 변수를 설정할 수 있습니다 편집 : 완료?

android:adjustViewBounds="true" 
0

는 내가 100 % 당신이 뭘하려는 건지 이해한다면 모르겠지만, 당신은 화면에 이미지를 통해 훨씬 제어를 원한다면 당신은 오는 LunarLander 예를 체크 아웃, SurfaceView을 고려해야한다 SDK와 함께.

1

나를 위해 작동합니다. 두 개의 비트 맵 이미지를 전달하여 서로 오버레이합니다.

public static Bitmap overlay(String patho,String patht) { 
    Bitmap bmp1= BitmapFactory.decodeFile(patho); 
    Bitmap bmp2= BitmapFactory.decodeFile(patht); 
    Bitmap bmOverlay = Bitmap.createBitmap(bmp1.getWidth(), bmp1.getHeight(), bmp1.getConfig()); 
    Canvas canvas = new Canvas(bmOverlay); 

    Matrix m=new Matrix(); 
    canvas.drawBitmap(bmp1, m, null); 

    canvas.drawBitmap(bmp2, m,null); 
    return bmOverlay; 
} 
관련 문제