Hints: First you know how to create
Web Dynpor JAVA project.
After creating component->Goto Context->Right click->Create Node->Cardinality both(Collection and Selection) should be 1-1->Right click on Node->Create attribute->Click on Radio Button Manually->Give any name->Select type from drop down Box.
Follow the same step to create another node with attibute.
Create Two more attribute like below screen shots.
Select root context->Right click->attributes->click Radiobutton Manual->Give name(Value)->select the type using browser after click browser->select com.sap.ide.webdynpro.uielementdefinitins->Visibility.
Follow the same step to create another attribute.
In component model using data link create a link between your view and compnent meanwhile do the context mapping.
Double click on your view then Right click->Apply Template->Form->Select Your first node. Then drag and drop the button->create action for that.You do this with Group UI element.
Do the following for the Second node after complete your step your view layout display like below.
Click on your First group->Goto property->Bind the visibility attribute to visible like below.
Do the same for second group.
In view Doinit method write the following code.
In first button action write the following code.
then save your project and build and deploy.
Run your application you hava the following output.