Skip to main content

Change View Components

DhiWise auto-identifies all your screen view components and generates a complete code for the same. Generally, it auto-detects the components, but sometimes due to design changes, it may not able to identify them.

To get the missing component identified, you can change the view of the misidentified component to the correct one in DhiWise.

info

To get identify your components directly from Figma, you can also refer below;

Components like Calendar, Map and other similar complex components cannot be identified, so DhiWise offers functionality to change the view of that component and get your design identified properly. Below are such supported views:

tip

To know more about how to change the view of a component: For Flutter learn here, and for React learn here.

AutoCompleteTextField

AutoCompleteTextField are similar to TextField, just they have additional functionality of autofill.

If your application screen design has AutoCompleteTextField it would be identified as TextField, but to make it work like an AutoCompleteTextField you can easily change the view to AutoCompleteTextField.

caution

This component is only supported for Flutter.

Example banner

Calendar

A calendar is a complex design component, which cannot be identified easily, so to have a calendar simply change its view to Calendar.

Example banner

Chart

If your web pages have charts in the application design, change the component to Chart. Learn more.

caution

This component is only supported for React.

Change view to Chart

GoogleMap

If your application design has a Google map, it would be identified as an Image probably, so to correct it according to your design, change the view to Map.

Example banner

Image Magnifier

Change the magnifier icon to Image magnifier for your web pages, to have a real image magnifier in your application design.

caution

This component is only supported for React.

Convert the texts of your web pages to Link, and provide the URLs to make them function as a link. Learn more.

caution

This component is only supported for React.

Change view to link

Searchable Dropdown

To convert the dropdown into a searchable picker for an item, convert it to a Searchable Dropdown.

caution

This component is only supported for React.

Change view to Search

Slider

Sliders allow users to make selections from a range of values.

Convert the components to Slider, and also change the icons for the Previous and Next control to slide the pages front and back. Also, you can change the component to Pager indicator. Learn more.

caution

This component is only supported for React.

Change view to Slider

Video Player

Change the component to a Video Player.

caution

This component is only supported for React.

Change view to Video Player



Got a question? Ask here.