2017-06-21 71 views
1

我是android編程的新手。我想製作一個會有閃卡的應用程序。這些閃卡會有單詞,當我觸摸它們時,它會轉而顯示單詞的含義。在Android Studio中製作Flashcards

我搜索谷歌。但是我找不到任何適合製作閃卡的教程。

謝謝!

+0

我已經提供了下面的完整有效的解決方案。讓我知道這是否解決了您的問題! –

回答

5

歡迎來到Android Richa。

我已經發現了一些有用的鏈接給你:

基本上你會用動畫和ImageViews合作。 這裏列出的最好的鏈接是你正在嘗試做的是「翻轉動畫解釋」。

Card tutorial

Curl/Flip animations

Flip animation explained

Cool flip card library

你將建立你的卡的佈局,然後活動。一旦到位,您將在XML中製作動畫。

我發現這裏的代碼:

主要活動

public class MainActivity extends AppCompatActivity { 

private AnimatorSet mSetRightOut; 
private AnimatorSet mSetLeftIn; 
private boolean mIsBackVisible = false; 
private View mCardFrontLayout; 
private View mCardBackLayout; 

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

} 

private void changeCameraDistance() { 
    int distance = 8000; 
    float scale = getResources().getDisplayMetrics().density * distance; 
    mCardFrontLayout.setCameraDistance(scale); 
    mCardBackLayout.setCameraDistance(scale); 
} 

private void loadAnimations() { 
    mSetRightOut = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.out_animation); 
    mSetLeftIn = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.in_animation); 
} 

private void findViews() { 
    mCardBackLayout = findViewById(R.id.card_back); 
    mCardFrontLayout = findViewById(R.id.card_front); 
} 

public void flipCard(View view) { 
    if (!mIsBackVisible) { 
     mSetRightOut.setTarget(mCardFrontLayout); 
     mSetLeftIn.setTarget(mCardBackLayout); 
     mSetRightOut.start(); 
     mSetLeftIn.start(); 
     mIsBackVisible = true; 
    } else { 
     mSetRightOut.setTarget(mCardBackLayout); 
     mSetLeftIn.setTarget(mCardFrontLayout); 
     mSetRightOut.start(); 
     mSetLeftIn.start(); 
     mIsBackVisible = false; 
    } 
    } 
} 

您與相機的距離搞亂這裏,以確保翻轉動畫屏幕上看到的。因爲它可能穿越「虛擬線路」而根本看不到。

卡的前端XML

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

    <ImageView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:tint="@color/cardFront" 
     android:padding="16dp" 
     android:src="@drawable/rectangle"/> 

    <TextView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:text="@string/front" 
     android:textColor="@color/white" 
     style="@style/Base.TextAppearance.AppCompat.Display1" 
     android:gravity="center"/> 

</FrameLayout> 

卡返回XML

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



    <ImageView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:tint="@color/cardBack" 
     android:padding="16dp" 
     android:src="@drawable/rectangle"/> 

    <TextView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:text="@string/back" 
     android:textColor="@color/white" 
     style="@style/Base.TextAppearance.AppCompat.Display1" 
     android:gravity="center"/> 


</FrameLayout> 

活動XML

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="blog.droidsonroids.pl.blogpost.MainActivity" 
    android:onClick="flipCard"> 


    <FrameLayout 
     android:id="@+id/card_back" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 
     <include layout="@layout/card_back" /> 


    </FrameLayout> 

    <FrameLayout 
     android:id="@+id/card_front" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:gravity="center"> 
     <include layout="@layout/card_front" /> 

    </FrameLayout> 


</FrameLayout> 

在動畫XML

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

    <objectAnimator 
     android:valueFrom="1.0" 
     android:valueTo="0.0" 
     android:propertyName="alpha" 
     android:duration="0" /> 


    <objectAnimator 
     android:valueFrom="-180" 
     android:valueTo="0" 
     android:propertyName="rotationY" 
     android:repeatMode="reverse" 
     android:duration="@integer/anim_length" /> 

    <objectAnimator 
     android:valueFrom="0.0" 
     android:valueTo="1.0" 
     android:propertyName="alpha" 
     android:startOffset="@integer/anim_length_half" 
     android:duration="0" /> 
</set> 

出動畫

<?xml version="1.0" encoding="utf-8"?> 
<set xmlns:android="http://schemas.android.com/apk/res/android"> 
    <objectAnimator 
     android:valueFrom="0" 
     android:valueTo="180" 
     android:propertyName="rotationY" 
     android:duration="@integer/anim_length" /> 

    <objectAnimator 
     android:valueFrom="1.0" 
     android:valueTo="0.0" 
     android:propertyName="alpha" 
     android:startOffset="@integer/anim_length_half" 
     android:duration="0" /> 
</set> 
+2

儘管此鏈接可能會回答問題,但最好在此處包含答案的重要部分,並提供供參考的鏈接。如果鏈接頁面更改,則僅鏈接答案可能會失效。 - [來自評論](/ review/low-quality-posts/16488483) – Aurasphere

+2

讓我快速編輯。謝謝! –

+1

更新並完全解答! –