I used viewFlipper to make onboarding screen and tried to add text in every slide, but I don't know how to display it in the activity_slider
.
This is the activity_slider
:
<ViewFlipper
android:id="@+id/viewFlipper"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginVertical="100dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<include layout="@layout/slide1" />
<include layout="@layout/slide2" />
<include layout="@layout/slide3" />
</ViewFlipper>
and this is the slide1 and the others is the same but with different imgs
<ImageView
android:id="@+id/titleImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:src="@drawable/collaborate"/>
<TextView
android:id="@+id/texttitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:fontFamily="@font/poppins_bold"
android:text="@string/heading_one"
android:textAlignment="center"
android:textColor="@color/black"
android:textSize="28dp" />
<TextView
android:id="@+id/textdeccription"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginHorizontal="30dp"
android:fontFamily="@font/poppins"
android:text="@string/desc_one"
android:textAlignment="center"
android:textColor="@color/black"
android:textSize="16dp" />
And here is the onboarding code:
private lateinit var viewFlipper: ViewFlipper
private lateinit var nextButton: Button
private lateinit var backButton: Button
private lateinit var skipButton: Button
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_slider)
viewFlipper = findViewById(R.id.viewFlipper)
nextButton = findViewById(R.id.nextbtn)
backButton = findViewById(R.id.backbtn)
skipButton = findViewById(R.id.skipButton)
viewFlipper.setOutAnimation(this, android.R.anim.slide_out_right)
viewFlipper.setInAnimation(this, android.R.anim.slide_in_left)
nextButton.setOnClickListener {
viewFlipper.showNext()
if (viewFlipper.currentView == viewFlipper.getChildAt(viewFlipper.childCount - 1)) {
startActivity(Intent(this, SignupActivity::class.java))
} else {
viewFlipper.showNext()
}
}
backButton.setOnClickListener {
viewFlipper.showPrevious()
}
skipButton.setOnClickListener {
val sharedPreferences: SharedPreferences = getSharedPreferences("onboarding_prefs", MODE_PRIVATE)
sharedPreferences.edit().putBoolean("isFirstTime", false).apply()
startActivity(Intent(this, SignupActivity::class.java))
finish()
}
}
}
I expected to see the onboarding screen with text, what could I be doing wrong?
i added to the onboarding activity an index and added text that changes based on index number
Onboarding Activity (Onboarding.kt)
private val slideTexts = arrayOf(
"Welcome to our app",
"Discover amazing features",
"Get started now"
)
private var currentIndex = 0
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_slider)
viewFlipper = findViewById(R.id.viewFlipper)
nextButton = findViewById(R.id.nextbtn)
backButton = findViewById(R.id.backbtn)
skipButton = findViewById(R.id.skipButton)
textSlide = findViewById(R.id.textSlide)
updateSlideText()
viewFlipper.setOutAnimation(this, android.R.anim.slide_out_right)
viewFlipper.setInAnimation(this, android.R.anim.slide_in_left)
nextButton.setOnClickListener {
if (currentIndex < viewFlipper.childCount - 1) {
currentIndex++
viewFlipper.showNext()
updateSlideText()
} else {
navigateToSignup()
}
}
backButton.setOnClickListener {
if (currentIndex > 0) {
currentIndex--
viewFlipper.showPrevious()
updateSlideText()
}
}
XML Layout (activity_slider.xml)
<TextView
android:id="@+id/textSlide"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Welcome to our app"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@+id/ellipse1"
app:layout_constraintTop_toBottomOf="@+id/viewFlipper" />