infocardslider

OCInformationCardView - A Custom Composable UI Component

The OCInfoCardSliderView composable is a customizable card view for displaying information. It can include a generic content and right direction button.

Features

• User can pass the desired information to show like title, description, caption.
• In onClick mathod, user can defined their click action for button
• swift left and right of the information card view and can able to right direction button click

How to use OCInfoCardSlider

1. Add the necessary imports:

   import your.package.name.OCInfoCardSlider

2. Use the required List Item in your Composable:

    val item1 = OCInfoCardSliderConfig(
        title = "Videosprechstunde",
        description = "Description1",
        caption = "Dein Termin heute um \n 13:00 Uhr ",
        largeIconComposable = {
                    Image(
                        painter = painterResource(id = R.drawable.transfer),
                        contentDescription = "Large icon description",
                        contentScale = ContentScale.None,
                        colorFilter = ColorFilter.tint(OCTheme.colors.cardsInfoCardOnBackgroundDefault),
                        modifier = Modifier.clearAndSetSemantics {
                            contentDescription = "Large icon description"
                        },
                    )
                },
        leadIconPosition = OCInfoCardImagePosition.CenterVertical,
        cardBackgroundColor = CardInfoCardBackgroundBlue,
        buttonText = ButtonConfig("", iconResID = R.drawable.arrow_right)
    )
   val item2 = OCInfoCardSliderConfig(...)
   val item3 = OCInfoCardSliderConfig(...)
   
   val items = arrayListOf(item1, item2, item3)
   

3. Use the OCInfoCardSliderView within your Composable:

OCInfoCardSlider with large icon

    val item1 = OCInfoCardSliderConfig(
        title = "Videosprechstunde",
        description = "Description1",
        caption = "Dein Termin heute um \n 13:00 Uhr ",
        largeIconComposable = {
                    Image(
                        painter = painterResource(id = R.drawable.transfer),
                        contentDescription = "Large icon description",
                        contentScale = ContentScale.None,
                        colorFilter = ColorFilter.tint(OCTheme.colors.cardsInfoCardOnBackgroundDefault),
                        modifier = Modifier.clearAndSetSemantics {
                            contentDescription = "Large icon description"
                        },
                    )
                },
        leadIconPosition = OCInfoCardImagePosition.CenterVertical,
        cardBackgroundColor = CardInfoCardBackgroundBlue,
        buttonText = ButtonConfig("", iconResID = R.drawable.arrow_right)
    )
    val items = arrayListOf(item1, item1, item1, item1)
    
    OCTheme {
        OCInfoCardSliderView(itemsList = items, onButtonClick = {})
    }

Parameters for OCInfoCardSliderView:

• itemsList : Number of OCInfoCardSliderConfig items to get slider composable from OCInfoCardSlider

Parameters for OCInfoCardSlider:

• pageState : PagerState of the information
• focused : Boolean of state to update style on dot indicator
• itemsList : list of slider cards
• onClick : click actions for each info card