2013-01-05 12 views
13

Próbuję wymyślić sposób ułożenia serii widoków wokół koła, w taki sposób, że każdy widok jest obrócony tak, aby był skierowany na zewnątrz z koła. Poniższy rysunek jest szkicem tego, czego szukam. Blok zewnętrzny to układ/widok, czerwone kwadraty reprezentują widoki, które chcę obrócić.Widoki układu Android obracają się i są rozmieszczone wokół koła?

Rough Sketch of what I want to do

jestem zaznajomiony z PivotX, PivotY, i obracanie widoku Właściwości i podejrzewam, będę wykorzystanie ich w jakiś sposób, ale nie jestem pewien, jak z nich korzystać w porozumieniu ze związkiem odpowiedni układ, aby uzyskać pożądany efekt.

Odpowiedz

24

Oto przykład, który to robi. Stworzyłem nowy projekt Androida i zastąpiłem już istniejący RelativeLayout z FrameLayout. To> = 11 API tylko z powodu tłumaczą i obracają połączeń w View:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/main" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context=".MainActivity" > 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center" 
     android:text="@string/hello_world" /> 
</FrameLayout> 

będę tworzyć kilka szybkich widoki w kodzie, po prostu zastąpić je niezależnie od poglądów masz. Umieszczam je wszystkie na środku układu, ustawiając wagę ich LayoutParams na Gravity.CENTER. Następnie mam tłumaczenia i obracanie ich do właściwych pozycjach:

@Override 
protected void onCreate(Bundle savedInstanceState) 
{ 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 

    final FrameLayout main = (FrameLayout)findViewById(R.id.main); 

    int numViews = 8; 
    for(int i = 0; i < numViews; i++) 
    { 
     // Create some quick TextViews that can be placed. 
     TextView v = new TextView(this); 
     // Set a text and center it in each view. 
     v.setText("View " + i); 
     v.setGravity(Gravity.CENTER); 
     v.setBackgroundColor(0xffff0000); 
     // Force the views to a nice size (150x100 px) that fits my display. 
     // This should of course be done in a display size independent way. 
     FrameLayout.LayoutParams lp = new FrameLayout.LayoutParams(150, 100); 
     // Place all views in the center of the layout. We'll transform them 
     // away from there in the code below. 
     lp.gravity = Gravity.CENTER; 
     // Set layout params on view. 
     v.setLayoutParams(lp); 

     // Calculate the angle of the current view. Adjust by 90 degrees to 
     // get View 0 at the top. We need the angle in degrees and radians. 
     float angleDeg = i * 360.0f/numViews - 90.0f; 
     float angleRad = (float)(angleDeg * Math.PI/180.0f); 
     // Calculate the position of the view, offset from center (300 px from 
     // center). Again, this should be done in a display size independent way. 
     v.setTranslationX(300 * (float)Math.cos(angleRad)); 
     v.setTranslationY(300 * (float)Math.sin(angleRad)); 
     // Set the rotation of the view. 
     v.setRotation(angleDeg + 90.0f); 
     main.addView(v); 
    } 
} 

A ta jest wynikiem:

Image of 8 views in a circle

+1

@daniel dałem wszystkie jawnie wpisanej wartości w DP ale koło nie jest taka sama na urządzeniach o różnych rozmiarach i rozdzielczościach – Naruto

+0

@ Daniel Johansson: Zamiast TextView użyłem przycisku. Mam problem z twoim kodem na http://stackoverflow.com/questions/39489343/how-to-detect-a-button-in-framelayout-when-swipe-buttons – Jame

+0

To było bardzo pomocne, dzięki! – mmmyum

1

Odpowiedź przez @Daniel jest wielki.

Jeśli potrzebujesz więcej funkcji można użyć to ładny biblioteki na GitHub nazywa Android-CircleMenu

enter image description here